Question

我有一个带有递增和递减按钮的代码：

<div class="form-group border-dark" id="quantity">
  <label class="text-center"><strong>Quantity:</strong></label><br>
 <span class= "btn-danger quantity-decrement fa fa-minus">
 </span>
          <input type="text" class="quantity" id="quant" name="quant" value="1" min="1" max="100" disabled>
           <span class= "btn-info quantity-increment fa fa-plus">
 </span>
   </div>

和另一个类似的东西：

   <div id = "eventdetail">
       <div class="card" style="padding-left:0px;">
      <div class="card-body">
         <div class="form-inline">
       <div class="form-group border-dark" id="selectname">
          <input type="text" class="form-control" id="epname" name="epname" placeholder="Enter your Full Name">
        </div>
         <div class="form-group border-dark" id="selectemail">
          <input type="email" class="form-control" id="epmail" name="epmail" placeholder="Enter your Email">
        </div>
         <div class="form-group border-dark" id="selectphone">
          <input type="tel" class="form-control" id="epnubmer" name="epnubmer" placeholder="Enter your Phone Number">
        </div>
             </div>
        </div>

       </div>
<div id = "eventdisplay">

我希望在#eventdisplay中使用增量按钮显示#eventdetail的次数。请问我该怎么做？

Answer 1

感谢所有试图回答我的问题的人。我找到了解决方法。对于那些可能有相同问题的人，这是我的解决方案：

$("#proceedevent").click(function() {

    var item = $('.eventdetail').show(); 

    count = parseInt($("#quant").val(), 10) - 1;
    for (var i = 0; i < count;i++){
        item.clone(true).appendTo('#eventdisplay');

    }
  $('.remove').click( function(){
           if($('.eventdetail').length > 1) {
                 $(this).closest(".eventdetail").remove();
            }else{
             $('.remove').hide();
            }
    });

});

这就是我所做的；

 var item = $('.eventdetail').show();

这是我正在克隆的课程，它以前是隐藏的，所以我必须显示它。

 count = parseInt($("#quant").val(), 10) - 1;

然后我要克隆它的次数。这是我主要问题中的递增按钮。

 for (var i = 0; i < count;i++){
        item.clone(true).appendTo('#eventdisplay');

    }

克隆

  $('.remove').click( function(){
           if($('.eventdetail').length > 1) {
                 $(this).closest(".eventdetail").remove();
            }else{
             $('.remove').hide();
            }
    });

我用它一次删除了克隆的部分，最后一个部分除外。

如何根据增量和减量按钮的输入来显示多次输入的卡？

1 个答案: