生成这些文本框后，删除正确的输入文本框时遇到了麻烦。
基本上，当选中复选框时，代码会生成文本输入。生成的文本输入包含所选复选框的值。所有这些工作都很好，复选框选择的依赖性。
我需要帮助的地方是删除包含取消选中复选框值的实际输入。现在，删除的一个总是最后一个输入框，而不是与被点击的复选框对应的输入框。
第二个问题如下。复选框是成对组织的。但是每对只能选择一个复选框，这样可以正常工作，但我从一个复选框转到另一个复选框，并且自动取消选中前一个复选框，也必须删除输入框。
以下是工作代码：
$(function() {
// Moneyline Visitor
var scntDiv = $('#p_scents');
var i = $('#p_scents p').size() + 1;
var arrmlv = $("#mlv").map(function() { return $(this).val(); }).get();
$('#mlv').change(function () {
if ($('#mlv').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrmlv +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='rlo']").attr("disabled", true);
$("input[name='rlu']").attr("disabled", true);
$("input[name='mll']").prop('checked', false);
} else if ($('#mlv').not(':checked')) {
i--;
$("input[name='rlo']").attr("disabled", false);
$("input[name='rlu']").attr("disabled", false);
$('.p_scnt'+ i +'').remove();
}
});
// Moneyline Local
var arrmll = $("#mll").map(function() { return $(this).val(); }).get();
$('#mll').change(function () {
if ($('#mll').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrmll +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='rlo']").attr("disabled", true);
$("input[name='rlu']").attr("disabled", true);
$("input[name='mlv']").prop('checked', false);
} else if ($('#mll').not(':checked')) {
i--;
$("input[name='rlo']").attr("disabled", false);
$("input[name='rlu']").attr("disabled", false);
$('.p_scnt'+ i +'').remove();
}
});
// Runline Over
var arrrlo = $("#rlo").map(function() { return $(this).val(); }).get();
$('#rlo').change(function () {
if ($('#rlo').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrrlo +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='mlv']").attr("disabled", true);
$("input[name='mll']").attr("disabled", true);
$("input[name='rlu']").prop('checked', false);
} else if ($('#rlo').not(':checked')) {
i--;
$("input[name='mlv']").attr("disabled", false);
$("input[name='mll']").attr("disabled", false);
$('.p_scnt'+ i +'').remove();
}
});
// Runline Under
var arrrlu = $("#rlu").map(function() { return $(this).val(); }).get();
$('#rlu').change(function () {
if ($('#rlu').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrrlu +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='mlv']").attr("disabled", true);
$("input[name='mll']").attr("disabled", true);
$("input[name='rlo']").prop('checked', false);
} else if ($('#rlu').not(':checked')) {
i--;
$("input[name='mlv']").attr("disabled", false);
$("input[name='mll']").attr("disabled", false);
$('.p_scnt'+ i +'').remove();
}
});
// Over
var arrov = $("#ov").map(function() { return $(this).val(); }).get();
$('#ov').change(function () {
if ($('#ov').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrov +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='un']").prop('checked', false);
} else if ($('#ov').not(':checked')) {
i--;
$('.p_scnt'+ i +'').remove();
}
});
// Under
var arrun = $("#un").map(function() { return $(this).val(); }).get();
$('#un').change(function () {
if ($('#un').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scnt'+ i +'" size="20" name="p_scnt_' + i +'" value="'+ arrun +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='ov']").prop('checked', false);
} else if ($('#un').not(':checked')) {
i--;
$('.p_scnt'+ i +'').remove();
}
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input type="checkbox" id="mlv" name="mlv" value="+200"/>
<input type="checkbox" id="mll" name="mll" value="-200"/>
<input type="checkbox" id="rlo" name="rlo" value="+100"/>
<input type="checkbox" id="rlu" name="rlu" value="-100"/>
<input type="checkbox" id="ov" name="ov" value="+300"/>
<input type="checkbox" id="un" name="un" value="-300"/>
</br>
<div id="p_scents">
</div>
答案 0 :(得分：0)
更改输入类的名称是否有问题？如果没有，您可以在更改事件中尝试此操作：
$('#mlv').change(function () {
if ($('#mlv').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scntmlv" size="20" name="p_scnt_' + i +'" value="'+ arrmlv +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='rlo']").attr("disabled", true);
$("input[name='rlu']").attr("disabled", true);
$("input[name='mll']").prop('checked', false);
$('.p_scntmll').remove();
} else if ($('#mlv').not(':checked')) {
i--;
$("input[name='rlo']").attr("disabled", false);
$("input[name='rlu']").attr("disabled", false);
$('.p_scntmlv').remove();
}
});
// Moneyline Local
var arrmll = $("#mll").map(function() { return $(this).val(); }).get();
$('#mll').change(function () {
if ($('#mll').is(':checked')) {
$('<input type="text" id="p_scnt'+ i +'" class="p_scntmll" size="20" name="p_scnt_' + i +'" value="'+ arrmll +'" placeholder="No Disponible" />').appendTo(scntDiv);
i++;
$("input[name='rlo']").attr("disabled", true);
$("input[name='rlu']").attr("disabled", true);
$("input[name='mlv']").prop('checked', false);
$('.p_scntmlv').remove();
} else if ($('#mll').not(':checked')) {
i--;
$("input[name='rlo']").attr("disabled", false);
$("input[name='rlu']").attr("disabled", false);
$('.p_scntmll').remove();
}
});
注意我更改了每个输入的类以附加复选框的ID。这样，当取消选中复选框时，您只需删除与其关联的特定输入。选中复选框后，您将删除与您自动取消选中的复选框关联的输入。