我试图建立一个页面,您可以在其中填写我网站上用于新闻的类别。在此页面上,您应该能够添加和删除类别。现在的问题是......不知道怎么做。我没有JS只用html制作应该是什么样子。
输出:http://prntscr.com/59x898 http://prntscr.com/59x8cx
我的HTML:
<div class="titles">
<h4>Edit categories</h4>
</div>
<div class="portfolioContainer">
<form class="form-theme col-md-12" action="#">
<div class="row">
<div class="form-group">
<!-- This is where the divs should be -->
</div>
</div>
<div class="row">
<div class="col-md-6">
<input type="submit" value="Save" class="btn btn-lg btn-primary">
</div>
<div class="col-md-1 addRemoveB">
<input type="button" onclick="" value="+" class="btn btn-lg btn-primary">
</div>
<div class="col-md-1 addRemoveB">
<input type="button" onclick="" value="-" class="btn btn-lg btn-primary">
</div>
</div>
</form>
</div>
<!-- End Recent Post -->
这就是div的样子:
<div class="col-md-6">
<label>Categorie 1 </label>
<input type="cat" required="required" maxlength="30" class="form-control" name="cat" id="cat">
</div>
我的css ....好吧,我们可以说它到处都是1000行以上......
还可以使它在添加新输入时更改输入的标签,ID和名称吗?例如,cat-1 cat-2等等。
非常感谢! &LT; 3
答案 0 :(得分:0)
试试这个。我正在使用jquery添加div并删除它。如果你想要更多问我的用例。我改变了我的代码。
$(document).ready(function() {
var i = 0;
$("#plus").click(function() {
i++;
$("body").append("<div id='cat" + i + "'>hi " + i +"</div>")
});
$("#minus").click(function() {
$("#cat" + i).remove();
i--;
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="col-md-6" id="div1">
<label>Categorie 1</label>
<input type="text" required="required" maxlength="30" class="form-control" name="cat" id="cat">
</div>
<input type="button" value="Plus" id="plus" />
<input type="button" value="Minuss" id="minus" />