第一个框仍然在顶部使用jquery的第一个框下面的其他框

first box still at top other box below the first box using jquery

本文关键字：第一个 其他 jquery 顶部      更新时间：2023-09-26

顶部的第一个框—第一个框下方的其他框—一步一步。

** [jsfiddle]https://jsfiddle.net/Baloch007/9jo8tka5/14/**

看看这个：

	var i = 2;
	$('input[type=button]').click(function() {
	  $('#wrapper').append("<span>Box " + i + "</span>");
	  i++;
    if(i >= 8){
    	$(this).hide();
    }
	})
span {
  width: 40px;
  background: red;
  border: 1px solid black;
  display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <span>Box 1</span>
</div>
<input type='button' value='+' />

试试这个

<script     src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">    </script>
<ul id="Compare-to-add">
<div id="copy" style="display:none">
<li>Box</li>
</div>
<li>Box1</li>
<input type="hidden" id="max" name="max" value="1"/>
<li id="added-more">
<i class="fa fa-plus-circle"></i>
</li>
</ul>

并编写脚本

 $(document).ready(function() {
  $('#added-more').click(function() {
    var max=parseInt($('#max').val())+1;
    $('#copy li').html('Box'+max);
    var paste = $('#copy li').clone();
    $('#Compare-to-add').append(paste);
   $('#max').val(max);
    if ($("#Compare-to-add li:visible").size() == 9 )
    {
     $('#added-more').hide();
    }
  })
  });
相关文章：