javascript - 单击加号按钮后,如何重复获得相同的 div?
问题描述
我正在使用 php 来开发我的网站。我有一个<div>
包含多个输入字段的。<div>
现在我的问题是,一旦我继续单击加号按钮,如何重复重复相同的倍数。
<div id='testdiv' class='testclass'>
<form name="myForm" method="post" action="#" onsubmit="return validateForm();" autocomplete="off" enctype="multipart/form-data">
<input class="btn btn-success col-sm-1" type="submit" name="submit" id="submit" value="Save"/>
<div>
<h3 style="color:#1E90FF;"><center><b>My name</b></center></h3><br/>
<div class="col-sm-7">
<div class="col-sm-2">
<label id="test_lable" for="">my address:</label>
</div>
<div class="col-sm-6">
<input class="form-control input-sm" type="text" name="testname" id="testname" required /><br/>
</div>
</div>
<div class="col-sm-7">
<div class="col-sm-2">
<label><b>place</b></label>
</div>
</div>
<div class="col-sm-7">
<div class="col-sm-2">
<label><b>user Type</b></label>
</div>
</div>
<div ng-controller="AppCtrl" ng-cloak="" class="col-sm-7" ng-app="MyApp" style= "background-color: white">
<div class="col-sm-2" style="padding:29px;">
<label><b>Instance/s</b></label>
</div>
<div class="col-sm-6">
<md-content style="padding:10px; background-color: white">
<md-slider-container>
</md-slider>
<md-input-container>
</md-input-container>
</md-slider-container>
</md-content>
</div>
<div class="col-sm-7">
<div class="row">
<div class="col-xs-8 col-xs-offset-2 well">
<legend>Select File to Upload:</legend>
<div class="form-group">
<input type="file" name="file1" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
解决方案
.clone()
您必须在 jquery 中使用克隆整个 div 。然后单击按钮,您必须将其附加到您想要的位置。
检查这个小提琴。
或者,如果您有一个预定义的代码要在按钮单击时重复,那么您可以执行以下操作。
在php中
function get_repeat_html(){
?>
<div id="get_repeat_html" style="display:none;">
<div class="box" id="101">
<input type="text" value="text">
<p>Sample text</p>
</div>
</div>
>?php
}
在js中
$('.btn').click(function(){
var html = $('#get_repeat_html').html();
$('#target').append(html);
});
推荐阅读
- blockchain - 如何在 Solana 上与其他人的公共程序互动?
- c# - 单击按钮后禁用使用 CSSclass 的 asp.net C# gridview 样式
- if-statement - 将数据从多列转换为行并保留“标签”
- javascript - 在 Angular 11 中获取 http://localhost:4200/account/runtime.js net::ERR_ABORTED 404(未找到)
- python - 尝试使用开源库为我的数据集预测性别,但仅在预测性别中显示男性
- reactjs - react.js 重新渲染组件仅在为 state 赋予另一个值时才起作用,与以前不同
- reactjs - React Financial Chart 未显示图表并抛出错误 - 在严格模式树中检测到旧版上下文 API
- docker - Docker 容器无法使用容器名称访问另一个容器
- c - 二进制到八进制的转换。但是二进制数字在数组中?
- python - 使用 FastAPI testclient 时如何检查 JSON 响应类型