[英]How to create an HTML Input dynamically using jQuery?
我想在表單內部使用jQuery動態創建以下html輸入。 使用jQuery是否可能?
<div class="form-group">
<label class="col-sm-2 control-label">Enter Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nameId" name="fullNme" placeholder="Enter full Name">
</div>
</div>
我想將上面的動態div和texbox放在div class =“ box-body”下
<form id="myform" class="form-horizontal" method="post">
<div class="box-body">
</div>
</form>
有人可以幫我在Jquery / Javascript中實現嗎?
提前感謝您的幫助!
您可以這樣:
<script>
var html = '<div class="form-group"><label class="col-sm-2 control-label">Enter Name</label><div class="col-sm-10"><input type="text" class="form-control" id="nameId" name="fullNme" placeholder="Enter full Name"></div></div>';
$('.box-body').html(html);
</script>
另一種方法是:
<div id="container-bkp" style="display:none">
<div class="form-group">
<label class="col-sm-2 control-label">Enter Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nameId" name="fullNme" placeholder="Enter full Name">
</div>
</div>
</div>
<script>
$('.box-body').html($('#container-bkp').html());
</script>
你可以做,
var formgroup = $("<div/>", {
class: "form-group"
});
formgroup.append($("<label>", {
class: "col-sm-2 control-label",
text: "Enter Name"
}));
var colsm = $("<div/>", {
class: "col-sm-10"
});
var input = $("<input/>", {
type: "text",
class: "form-control",
id: "nameId",
placeholder: "Enter Full Namee"
});
colsm.append(input);
formgroup.append(colsm);
$(".box-body").append(formgroup);
您可以提供許多這樣的屬性。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.