jquery .find 适用于除 IE 之外的所有浏览器

发布于 2024-11-28 06:00:40 字数 1085 浏览 0 评论 0原文

我用 ul 和 li 构建了一棵树。每个 li 都有一个带有一些文本的复选框。当检查父元素时，我需要检查所有子元素。我用以下代码完成了它，该代码在 FF 和 Chrome 中有效，但在 IE 中无效...

function checkSC(el){

var $parent = $(el).parent();
$($parent).find('input[type="checkbox"]').attr("checked", el.checked);

}

html 如下所示：

<ul id="treeUL" class="treeview-black treeview">
  <li class="collapsable">
   <div class="hitarea collapsable-hitarea"></div>
   <input type="checkbox" onchange="checkSC(this)" value="26" name="chkComm">
    Conseil d'Administration
   <ul>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="29" name="chkComm[29]">
        Bureau
      </li>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="31" name="chkComm[31]">
        Comité de Direction
      </li>
      <li class="last">
      <input type="checkbox" onchange="checkSC(this)" value="62" name="chkComm[62]">
       Administrateurs Suppléants
      </li>
   </ul>
</li>

原文

I have a tree build with ul and li. Each li has an checkbox with some text. I need to check all child elements when the parent element is checked. I did it with following code, which works in FF and Chrome but not in IE...

function checkSC(el){

var $parent = $(el).parent();
$($parent).find('input[type="checkbox"]').attr("checked", el.checked);

}

The html looks like this:

<ul id="treeUL" class="treeview-black treeview">
  <li class="collapsable">
   <div class="hitarea collapsable-hitarea"></div>
   <input type="checkbox" onchange="checkSC(this)" value="26" name="chkComm">
    Conseil d'Administration
   <ul>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="29" name="chkComm[29]">
        Bureau
      </li>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="31" name="chkComm[31]">
        Comité de Direction
      </li>
      <li class="last">
      <input type="checkbox" onchange="checkSC(this)" value="62" name="chkComm[62]">
       Administrateurs Suppléants
      </li>
   </ul>
</li>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

就此别过 2024-12-05 06:00:40

请改用 onclick。 IE 似乎会等到你模糊了复选框。另外，只要您使用 jQuery，就可以使用它将事件处理程序分配给对象，而不是内联函数。

$(document).ready( function() {

    $("input[type='checkbox']").click( function() {
         $(this).parent().find('input[type="checkbox"]').attr("checked", this.checked);
    });

});

如果您仅将此处理程序添加到特定复选框，您可能需要更改选择器。

Use onclick instead. IE seems to wait until you've blurred the checkbox. Also, as long as you are using jQuery, use that to assign event handlers to objects instead of inline functions.

$(document).ready( function() {

    $("input[type='checkbox']").click( function() {
         $(this).parent().find('input[type="checkbox"]').attr("checked", this.checked);
    });

});

You may want to alter the selector if you are only adding this handler to specific checkboxes.

回复收藏 0 原文

牵强ㄟ 2024-12-05 06:00:40

尝试用“onclick”代替“onchange”。
onchange 不是复选框的有效事件。请参阅http://www.w3schools.com/jsref/event_onchange.asp

回复收藏 0 原文

糖果控 2024-12-05 06:00:40

$parent 已经是一个 jQuery 对象了。您不需要将其包装在另一个 jQuery 对象中。这与执行相同的操作：

$( $("#target_id") )

$parent is a jQuery object already. You don't need to wrap it in another jQuery obj. It's the same of doing:

$( $("#target_id") )

回复收藏 0 原文

内心激荡 2024-12-05 06:00:40

我认为问题可能来自 onchange 函数中使用的 this 关键字。

本文 https://forloop.co.uk/blog/ event-internals-in-jquery-part-one 解释了 jQuery 如何处理事件，作为一个有趣的警告，说明 this 在事件中如何解释的模型之间的差异：

处理函数中的 this 是什么？
W3C 和 IE 模型之间最大的区别之一是
this 关键字（函数上下文）引用事件内部
处理函数；在 W3C 模型中，这是对元素的引用
事件处理程序绑定在其上，但在 IE 中，this 指的是
全局对象（浏览器中的窗口对象）。这可真能绊倒
如果你不注意的话，你就起来（双关语）！

解决方案是使用 jQuery 绑定处理程序，从而不必处理不同浏览器的差异。