Javascript 动态添加时，jQuery remove（）无法处理div标记

我正在尝试调用加载页面后添加的

div

标记上的

remove（）

jQuery函数。我正在添加此

div

链接：

$(probablyHide).html(addedDiv);
<div class=probablyHide>
 <div onClick="myMethod(this)" class="hide" id="1">i want to hide this div 1</div>
 <div onClick="myMethod(this)" class="hide" id="2">i want to hide this div 2</div>
 <div onClick="myMethod(this)" class="hide" id="3">i want to hide this div 3</div>
</div>

奇怪的是，如果我在函数中编辑掉以下几行。该div将被删除

  button.val(div.id); 
    $(button).trigger('change');

---

如果要使用jQuery，请使用jQuery事件处理程序：

$(document).on('click', '.hide', function(){
    var $div = $(this);
    var button= $div.closest('div.otherDiv').find("select[id^='stuff']"); 
    button.val(this.id); 
    $div.remove();
    $(button).trigger('change');
});

---

另外，请尝试不为元素使用数字ID。

如果要使用jQuery，请使用jQuery事件处理程序：

$(document).on('click', '.hide', function(){
    var $div = $(this);
    var button= $div.closest('div.otherDiv').find("select[id^='stuff']"); 
    button.val(this.id); 
    $div.remove();
    $(button).trigger('change');
});

---

另外，请尝试不为元素使用数字ID。

这可能不起作用，因为您使用onLoad加载JavaScript

简单的修复方法是使用jQuery事件处理程序

演示：

固定HTML：

<div class="probablyHide">
    <div class="hide" id="1"> i want to hide this div 1 </div>
    <div class="hide" id="2"> i want to hide this div 2 </div>
    <div class="hide" id="3"> i want to hide this div 3</div>
</div>

我想把这个第一组藏起来
我想把这个第二组藏起来
我想把这个第三组藏起来

它可能不起作用，因为您使用onLoad加载JavaScript

简单的修复方法是使用jQuery事件处理程序

演示：

固定HTML：

<div class="probablyHide">
    <div class="hide" id="1"> i want to hide this div 1 </div>
    <div class="hide" id="2"> i want to hide this div 2 </div>
    <div class="hide" id="3"> i want to hide this div 3</div>
</div>

我想把这个第一组藏起来
我想把这个第二组藏起来
我想把这个第三组藏起来

您的代码很好证明：

您只需确保三件事：

当div生成时，您的处理程序（

myMethod

）需要存在。最好的方法是将它放在

标题

，并确保您没有在

文档之后创建它。加载

或类似的内容

jQuery的

.closest（）

方法查找包含当前元素的内容。因此，需要有一个带有

class=“otherDiv”

的div，并且它需要同时包含

可能是隐藏的
div和一个ID以
stuff“
开头的按钮。您的DOM可能具有错误的结构

按钮

应该是按钮还是下拉列表？您将其视为一个按钮，但您的代码正在查找

select[id^='stuff']

因此，只需修复选择器并将代码放入

：

函数myMethod（div）{
变量按钮=$（div）
.closest（'div.otherDiv'）
.find（“按钮[id^='stuff']”；//注意不同的选择器
//等等。。
}

在

内：

东西
我想把这个第一组藏起来
我想把这个第二组藏起来
我想把这个第三组藏起来

您的代码很好证明：

您只需确保三件事：

当div生成时，您的处理程序（

myMethod

）需要存在。最好的方法是将它放在

标题

，并确保您没有在

文档之后创建它。加载

或类似的内容

jQuery的

.closest（）

方法查找包含当前元素的内容。因此，需要有一个带有

class=“otherDiv”

的div，并且它需要同时包含

可能是隐藏的
div和一个ID以
stuff“
开头的按钮。您的DOM可能具有错误的结构

按钮

应该是按钮还是下拉列表？您将其视为一个按钮，但您的代码正在查找

select[id^='stuff']

因此，只需修复选择器并将代码放入

：

函数myMethod（div）{
变量按钮=$（div）
.closest（'div.otherDiv'）
.find（“按钮[id^='stuff']”；//注意不同的选择器
//等等。。
}

在

内：

东西
我想把这个第一组藏起来
我想把这个第二组藏起来
我想把这个第三组藏起来

Short note（尽管我站在你这边）：以数字开头的ID现在是。我不知道是否可以使用jquery事件处理程序。因为div是动态添加到页面的。不过我会尝试一下。我对jquery非常陌生，所以我说的每一句话在某种程度上都可能是错误的…@JeffNoel ID以数字开头，但仍然会导致CSS出现问题。尽管有一个解决方法：这不是问题所在，而且不引人注目的JavaScript不是唯一正确的解决方案。通过简单的DOM事件处理完全可以做到这一点：@JustinMorgan inline很难看。。。。他也在使用jQuery！最好使用jQuery！这里有一个简短的说明（尽管我站在你这边）：以数字开头的ID现在是。我不知道我是否可以使用jquery事件处理程序。因为div是动态添加到页面的。不过我会尝试一下。我对jquery非常陌生，所以我说的每一句话在某种程度上都可能是错误的…@JeffNoel ID以数字开头，但仍然会导致CSS出现问题。尽管有一个解决方法：这不是问题所在，而且不引人注目的JavaScript不是唯一正确的解决方案。通过简单的DOM事件处理完全可以做到这一点：@JustinMorgan inline很难看。。。。他也在使用jQuery！最好使用jQuery@DanyCaissy-他用

onClick=“myMethod（this）”

分配它，所以他不能这样做

div

是原始的HTML元素。我不知道为什么人们如此讨厌这个问题。“我见过比这更糟的了，”贾斯汀·摩根说。当下层选民不解释他们为什么这么做时，这尤其令人恼火。这对社区有什么好处？我引用StackOverflow文档中的一句话：“应该为极端情况保留否决权。它不是用来代替交流和编辑的。@DanyCaissy-他用

onClick=“myMethod（this）”

来分配它，所以他不能这样做

div

是原始的HTML元素。我不知道为什么人们如此讨厌这个问题。“我见过比这更糟的了，”贾斯汀·摩根说。尤其令人恼火的是，当下层选民不解释他们为什么要这么做的时候

<script type="text/javascript">
   function myMethod(div) {    
      var button = $(div)
                      .closest('div.otherDiv')
                      .find("button[id^='stuff']"); //note the different selector

      //etc..
   }
</script>

<div class="otherDiv">
    <button id="stuff">stuff</button>

    <div class="probablyHide">
        <div onClick="myMethod(this)" class="hide" id="1"> i want to hide this div 1 </div>
        <div onClick="myMethod(this)" class="hide" id="2"> i want to hide this div 2 </div>
        <div onClick="myMethod(this)" class="hide" id="3"> i want to hide this div 3</div>
    </div>
</div>