javascript - 如何将计数器的值替换为特定值-6ren

javascript - 如何将计数器的值替换为特定值

转载作者：行者123 更新时间：2023-12-03 05:05:51

27

4

我通过更改 num rooms 输入的值来创建一些输入。我想将 counter 的值替换为 span 中的特定值。例如下面的代码:

   for (var i =1; i <= $num; i++){
      "<span class=' btn-block room-name'>Room" + i +"</span>"
     }

如果 i=1 ， 1 替换为跨度中的第一个，结果:房间第一个。i=2 房间第二等。

   <div class="form-group col-sm-4">
     <input type="number" class="form-control numRoom-btn" placeholder="num rooms" min="1" max="5" />
   </div>
    <div id="room-container">    </div>


    $(document).ready(function () {
        $(".numRoom-btn").change(function () {
            switch (this.value) {
                case "1":
                    clearBefore();
                    addRoom("1");
                    break;
                case "2":
                    clearBefore();
                    addRoom("2");

                    break;
                case "3":
                    clearBefore();
                    addRoom("3");

                    break;
                case "4":
                    clearBefore();
                    addRoom("4");

                    break;
                case "5":
                    clearBefore();
                    addRoom("5");

                    break;
            }
        });
        function addRoom($num) {
            for (var i =1; i <= $num; i++) {

            var $addedElement = $(
                "<div class='numRoom calendar-container'>"+
            "<span class=' btn-block room-name'>Room" + i +"</span>" +
            "<div class='form-group col-sm-4'>"+
                "<span class='btn-block mb5'> Adult(+12)</span>"+
                "<input type='number' class='form-control' placeholder='adult nums' min='1' max='9' />"+
           "</div>"+
            "<div class='form-group col-sm-4'>"+
                "<span class='btn-block mb5'>child(-11)</span>"+
                "<input type='number' class='form-control' placeholder='child nums' min='0' max='6' />"+
            "</div>"+
       "</div>");

            $('#room-container').append($addedElement);
            }
        }

        function clearBefore() {
            $('.numRoom').remove();
        }

    });

最佳答案

更新的代码:

<html><head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">
      <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css">
      <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
      <link rel="stylesheet" type="text/css" href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css">
  <style type="text/css">
  </style>
  <title>Fontawesome example</title>

<script type="text/javascript">//<![CDATA[
window.onload=function(){

var number= ['zero', 'first', 'second', 'third', 'fourth', 'fifth'];

$(document).ready(function () {
        $(".numRoom-btn").change(function () {
          
            switch ($(this).val()) {
                case "1":
                    clearBefore();
                    addRoom("1");
                    break;
                case "2":
                    clearBefore();
                    addRoom("2");
                    break;
                case "3":
                    clearBefore();
                    addRoom("3");

                    break;
                case "4":
                    clearBefore();
                    addRoom("4");

                    break;
                case "5":
                    clearBefore();
                    addRoom("5");

                    break;
            }
        });
        function addRoom($num) {
            for (var i =1; i <= $num; i++) {

            $('#room-container').append("<div class='numRoom calendar-container'>"+
            "<span class=' btn-block room-name'>Room " + number[i] +"</span>" +
            "<div class='form-group col-sm-4'>"+
                "<span class='btn-block mb5'> Adult(+12)</span>"+
                "<input type='number' class='form-control' placeholder='adult nums' min='1' max='9' />"+
           "</div>"+
            "<div class='form-group col-sm-4'>"+
                "<span class='btn-block mb5'>child(-11)</span>"+
                "<input type='number' class='form-control' placeholder='child nums' min='0' max='6' />"+
            "</div>"+
       "</div>");
            }
        }

        function clearBefore() {
            $('.numRoom').remove();
        }

    });
}//]]> 

</script>
</head>
<body>
 <div class="form-group col-sm-4">
     <input type="number" class="form-control numRoom-btn" placeholder="num rooms" min="1" max="5" />
   </div>
   <div id="room-container"></div>

    
</body></html>

关于javascript - 如何将计数器的值替换为特定值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42005159/

27

4

0

文章推荐：使用 'by' 和条件替换 data.table 中的行值

文章推荐： .net - 如何评估我的 ASP.NET Web 应用程序是否容易被入侵？

文章推荐： javascript - 如何在 jQuery 的选择器中定义类似 OR 的东西？

c++ - map 计数器；计数器[nums[i]]++；
我在leetcode上看到这段代码，是一道求众数的题，下面是题目描述: 给定一个大小为 n 的数组，找到多数元素。众数元素是出现次数超过 ⌊ n/2 ⌋ 次的元素。你可以假设数组是非空的并且多数元素
JavaScript 计数器
每次在 JavaScript 中执行特定操作时，例如: $(function() { $('#typing').keyup(function () { switch($(this)
用于大小数字的 Javascript 计数器
我一直在为网页设计一个计数器，但我一直被这个我无法解决的功能所困扰。我有一个 4 个 div 的计数器，因为其中两个是小数字，另外两个是大数字，所以第一个运行得很快，我看不到它们的功能。有人知道如
Jquery every() 计数器
我已经在文档中进行了一些搜索，并在网上花了一段时间，但找不到解决方案!我希望警报告诉我单击 .thumb 时它处于each() 的哪一次迭代。 EG:有六个.thumb，我点击数字3，浏览器弹出3!
javascript - Handlebars 计数器#each
在 Handlebars 中，假设我有 names 的集合.我能怎么做 {{#each names}} {{position}} {{name}} {{/each}} 在哪里 {{position}}
r - 为数据帧的每组中的行创建一个序列号(计数器)
这个问题在这里已经有了答案: Numbering rows within groups in a data frame (9 个回答) 4年前关闭。我们如何在数据帧的每组中生成唯一的 ID 号？以下
数字序列的 SAS 计数器
我正在努力解决以下问题。我希望为给定的“一”序列创建一个计数器。例如，我有以下内容: 1 1 1 1 0 0 1 1 1 0 0 1 1 1 1 鉴于该序列，我希望为 1 的每个序列设置一个计数器直到
数字序列的 SAS 计数器
我正在努力解决以下问题。我希望为给定的“一”序列创建一个计数器。例如，我有以下内容: 1 1 1 1 0 0 1 1 1 0 0 1 1 1 1 鉴于该序列，我希望为 1 的每个序列设置一个计数器直到
带小数位的 JavaScript 计数器
我有一个jsfiddle here 这是一个简单的 JavaScript 函数，可以计算出设定的数字。是否可以进行这种计数，但也保留一位小数所以它算 1.1、1.2、1.3 等。 func
具有最大值和最小值的 jQuery 计数器
我正在构建一个计数器，当我按下鼠标时，它应该增加到 maxValue 并且减少不超过 0。我还可以选择将计数器重置为其初始值:0。另外，如果 maxValue 是偶数，它应该计数到该数字。但是，如果
特定标点符号的 C 计数器
所以我成功地为字母和单词构建了其他计数器，但现在我只能用这个来计算句子。我的代码如下，当我运行它时，它会返回很多错误消息: #include #include #include int main
c - C回路，计数器
Closed. This question is off-topic。它当前不接受答案。
具有最近一小时值的 Java 计数器
我需要一个计数器，它会随着某些任务的完成而递增。我们只需要最后一小时的值，即窗口将移动而不是静态时间。解决此问题的最佳方法是什么？我能想到的一种方法是拥有一个大小为 60 的数组，每分钟一个，并更新
PHP 计数器，用于从按钮获取唯一引用
我希望使用计数器来为我提供独特的引用系统。我想单击一个按钮，然后检查一个字段/文件中的最后一个数字，然后简单地向其添加 1，然后将其插入到屏幕上的字段中？不确定执行此操作的最佳方法或具体如何执行此操
PHP 类似表格内的按钮(计数器)
我有一个用 php 制作的表格，在该表格内我显示了数据库中的一些内容。我在每个 td 中创建了一个简单的按钮(类似于 Like)，我希望每次点击它都会增加 1。这是带有按钮的行: echo "
c# - if (计数器==<数据库值>)
如何将数据库中的值转换为可用于 if else 函数的 int 值？例如:在我的数据库“armnumber = 3”中，如何在 if else 函数中使用它？代码 string myConnect
针对特定情况的 MySQL 计数器
我需要生成唯一的“ids”，问题是，它只能在 1 - 99999 之间。 “好”的是，它仅在与另一列组合时必须是唯一的。我们有组，每个组都有自己的“group_id”，每个组都需要类似 unique
Mysql计数器字段。计数器 + 1
有这个简单的代码: UPDATE counter SET c= c +1 where id = 1; 并且它在开头的 c 字段中为 null 的情况下不起作用。它只有在已经输入了一些数字时才有效，也就
带闭包的 python 计数器
我正在尝试在 python 中构建一个具有闭包属性的计数器。以下工作中的代码: def generate_counter(): CNT = [0] def add_one():
用文字写出的 CSS 计数器
我使用 CSS 来计算 HTML 文档中的部分: body {counter-reset: sect;} section:before { counter-increment: sect;

首页

博学

6Ren·AI

商城

javascript - 如何将计数器的值替换为特定值