Question

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

   <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();
        }

    });

如果i = 1，则首先替换为span中的first和结果：Room。我= 2个房间等等。

//install body-parser
npm install body-parser



//Sample code within your app
var express = require('express')
var bodyParser = require('body-parser')

var app = express()

// create application/json parser
var jsonParser = bodyParser.json()

// create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })

// POST /login gets urlencoded bodies
app.post('/login', urlencodedParser, function (req, res) {
  if (!req.body) return res.sendStatus(400)
  res.send('welcome, ' + req.body.username)
})

Answer 1

更新代码：

{{1}}

Answer 2

你可以简化一点。你总是想要清空容器，你知道输入的房间数量。

<script>

$(function(){
$(".numRoom-btn").on('change', function(e){

  var numInput = $(e.target), $num = parseInt(numInput.val()), roomcontainer = $('#room-container');
  roomcontainer.empty();

  for(let i=0;i<$num;i++){
    addRoom(i+1);
  }

});


function addRoom($num){
  var $addedElement = $(
            "<div class='numRoom calendar-container'>"+
        "<span class=' btn-block room-name'>Room" + $num +"</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);
}

  });

在这里查看jsbin https://jsbin.com/luyarowaku/edit?html,console,output

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

2 个答案: