Question

我试图在加载页面后添加的remove()标记上调用div 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>

但由于某种原因，我的remove()无法正常工作。

function myMethod(div)
{
    var button = $(div).closest('div.otherDiv').find("select[id^='stuff']");    
    button.val(div.id); 
    $(div).remove();
    $(button).trigger('change');
};

如果我在我的函数中编辑以下行，那有什么奇怪的。 div将被删除。

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

Answer 1

如果要使用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。

Answer 2

它可能无法正常运行，因为您在onLoad上加载了JavaScript。

简单的解决方法是使用jQuery事件处理程序

演示：enter link description here

//$('.probablyHide').html(addedDiv);
//Use the following:
addDiv($('.probablyHide'), addedDiv);


function myMethod(div){

    var button= $(div).closest('div.otherDiv').find("select[id^='stuff']");
    button.val(div.id); 
    $(div).remove();
    $(button).trigger('change');
}

function addDiv(container, element) {
    container.append(element);
    element.click(function() {
          myMethod(this);  
    });
}

$('.probablyHide .hide').each(function() {
    $(this).click(function() {
          myMethod(this);  
    });
})

修正了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>

Answer 3

你的代码很好。 证明：http://jsfiddle.net/uQ9Xz/

您只需要确认三件事：

当div出生时，你的处理程序（myMethod）需要存在。最好的方法是将其放在head中，并确保在document.load或类似之后不创建它。
jQuery的.closest()方法查找包含当前元素的内容。因此需要有class="otherDiv"的div，并且它需要包含您的probablyHide div和ID以"stuff"开头的按钮。您的DOM可能具有错误的结构。
button应该是按钮还是下拉列表？您将其视为按钮，但您的代码正在寻找select[id^='stuff']。

所以只需修复选择器并将代码放在<head>：

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

      //etc..
   }
</script>

在<body>：

<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>

动态添加时，jQuery remove（）不能处理div标记

3 个答案: