有没有办法更好地编码?另外我想将标签的值更改为“A1,A2”,“B1,B2”等等。但我不知道如何。
脚本:
//remove button
$('.removeBtn').click( function() {
var counts = $(this).parent().parent().children().length-3;
if(counts < 4) {
$(this).parent().parent().find('.addBtn').show();
}
$(this).parent().remove();
});
//add button
$('.addBtn').click( function() {
var counts = $(this).parent().children().length+1;
var content = $(this).prev();
if (counts > 4) {
$(this).parent().find('.addBtn').hide();
}
content.clone(true,true).insertAfter(content).find('.removeBtn').show().end()
.find('input').val('');
});
这里是克隆内容的HTML
<div class="cointainer">
<div class="content">
<label for="itemFirst">A 1:</label>
<input type="text" name"itemFirst[]">
<button class="removeBtn hide">Remove</button>
</div>
<button class="addBtn">Add Another</button>
</div>
<hr>
<div class="cointainer">
<div class="content">
<label for="itemSecond">B 1:</label>
<input type="text" name"itemSecond[]">
<button class="removeBtn hide">Remove</button>
</div>
<button class="addBtn">Add Another</button>
</div>
答案 0 :(得分:1)
尝试
<label for="itemFirst">A <span class="label-num">1</span>:</label>
和
//remove button
$('.removeBtn').click( function() {
var cointainer = $(this).closest('.cointainer');
var counts = cointainer.children('.content').length;
counts--;
if(counts < 4) {
cointainer.children('.addBtn').show();
if (counts == 1) {
cointainer.find('.removeBtn').hide();
}
}
$(this).parent().remove();
cointainer.find('.label-num').text(function(idx){
return 1 + idx
})
});
//add button
$('.addBtn').click( function() {
var cointainer = $(this).closest('.cointainer');
var counts = cointainer.children('.content').length;
var content = $(this).prev();
counts++;
if (counts > 4) {
$(this).hide();
}
content.clone(true,true).insertAfter(content).find('input').val('').end().find('.label-num').text(counts);
cointainer.find('.removeBtn').show();
});
演示:Fiddle
答案 1 :(得分:-1)
我的理解是你要替换按钮的A1,A2内容等。
$('div.container')
.html('<p>All new content. <em>You bet!</em></p>');
对于输入,文本区域,请使用 val 关键字。 http://api.jquery.com/val/