Question

如果取消选中复选框，如何从div中删除元素？

function dispCmpName(id) {

            var campdip = $('#camp' + id).html();
            if ($("#campaign-name-disp").text().search("" + campdip) === -1) {
                $("#campaign-name-disp").append('<br/><div id=campSub'+ id +'>'+ campdip + '<img src="./images/remove.png"alt="Delete Campaign" title="Delete Campaign" style="cursor: pointer" onclick="deleteCamp()"/>'+'</div>');
            } else {
               alert(id);
               $('#campaign-name-disp).remove(campdip);
            }
        }

<div>
  <p id="campaign-name-disp"></p>
</div>

<input type="checkbox" class="checkBoxClass1" id="${campDetails.campaignId}" name="campaignId" value="${campDetails.campaignId}" onclick="dispCmpName(${campDetails.campaignId})"/>

<td id="camp${campDetails.campaignId}">${campDetails.campaignName}</td>

每当我勾选复选框时，系统会调用 dispCmpName 函数，并将div下的广告系列名称添加到ID为 campaign-name-disp 的p标记中。当我取消选中该复选框时，我想使用div ID从我的p标签中删除该广告系列名称。任何人都可以帮我解决如何在取消选中时删除名称。

注意：每个div id都是唯一的。我的div ids看起来像这样

    <p id="campaign-name-disp">
<div id="campSub382581148">campaign name 1</div>
<div id="campSub382581148">campaign name 2</div>
</p>

Answer 1

您可以使用更改事件更整洁地执行此操作，并使用＆＃34;已选中＆＃34;复选框的属性，以决定做什么。而且你需要在一个元素中包装每个广告系列名称（我假设可以有多个广告系列名称），这样你就可以在删除它时将其用作句柄：

prefetch_count

和

$(".campaignCheckBox").change(function(event) {
  var id = $(this).val();

  if ($(this).prop("checked") == true) {
    $("#campaign-name-disp").append('<span id="campaign-name-' + id + '">' + $('#camp' + id).html() + '</span>');
  }
  else {
    $("#campaign-name-" + id).remove();
  }
});

Answer 2

调用函数时，您可以检查复选框是否已“选中”。在这里，您可以看到如何检查它的示例：

if(document.getElementById(<id>).checked) {}

How to check whether a checkbox is checked in jQuery?

如何在取消选中复选框时从div中删除元素？

2 个答案: