使用jquery动态添加div [英] Dynamically add a div using jquery
本文介绍了使用jquery动态添加div的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
嗨
我有一个大的div，当我点击这样的按钮时我想添加它：
带按钮的主div：
Hi
I have a large div and I want to add it when I click the button like this:
Main div with button:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<script type="text/javascript" src="JavaScript/jquery-1.7.2.js"></script>
<script type="text/javascript" src="JavaScript/jquery.sparkline.js"></script>
<script type="text/javascript" src="JavaScript/jquery-ui-1.8.21.custom.min.js"></script>
<body>
<div id="divMain">
<label id="lblTitle">Add Here ...</label>
</div>
<div>
<input type="button" id="btnAddControl" value="Add Control"/>
</div>
<script type="text/javascript">
$("#btnAddControl").click(function () { $("#divMain").append("<br/><div id='New'>New</div>")});
</script>
</body>
</html>
这是我想要在主div中的div：
And this is the div I want to be in the main div:
<div class="divTable">
<div class="divRow">
<div class="divCell">
<input type="text" id="lable" value="something" readonly="readonly"/>
<button id="help-icon" style="width:13px ; height:13px">help</button>
<div id="pop-up" class="divCell">
loading...Say what u want!
</div>
</div>
<div class="divCellmine">
<label for="amount1">min:</label>
<input type="text" id="amount1" style="border:0; font-weight:bold;" />
</div>
<div class="divCellmine">
<div id="slider-range" style="width: 142px; height: 1px"></div>
</div>
<div class="divCellmine">
<label for="amount2">max:</label>
<input type="text" id="amount2" style="border:0; font-weight:bold;" />
</div>
</div>
</div>
推荐答案
（ ＃btnAddControl）。click（ function （）{
("#btnAddControl").click(function () {
（ #divMain）。append（ < br />< div id ='New'> New< / div>）}）;
& / script >
< / body >
< / html >
("#divMain").append("<br/><div id='New'>New</div>")}); </script> </body> </html>
这是我希望在主div中的div ：
And this is the div I want to be in the main div:
<div class="divTable">
<div class="divRow">
<div class="divCell">
<input type="text" id="lable" value="something" readonly="readonly"/>
<button id="help-icon" style="width:13px ; height:13px">help</button>
<div id="pop-up" class="divCell">
loading...Say what u want!
</div>
</div>
<div class="divCellmine">
<label for="amount1">min:</label>
<input type="text" id="amount1" style="border:0; font-weight:bold;" />
</div>
<div class="divCellmine">
<div id="slider-range" style="width: 142px; height: 1px"></div>
</div>
<div class="divCellmine">
<label for="amount2">max:</label>
<input type="text" id="amount2" style="border:0; font-weight:bold;" />
</div>
</div>
</div>
您可能希望为.divTable提供ID。
您应该从一开始就在DOM中包含.divTable
设置它的样式显示：none;
点击
You might want to give the .divTable an id.
You should include the .divTable in the DOM from the start
Set it's style to display:none;
On Click
var
这篇关于使用jquery动态添加div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
