`

搜索上级dom对象并隐藏,点击隐藏父元素

阅读更多
类似页面如下:

<tr>
  <td><input type="checkbox" class="chk" /></td>
  <td><div class="disabled">text to hide 1</div></td>
  <td><div class="disabled">text to hide 2</div></td>
</tr>



$("input.chk").click(function(){
  $(this).parent().parent().(".disabled").show();
}) ;


实际使用.closest() 和 .find()更合适
$("input.chk").click(function(){
  $(this).closest('tr').find(".disabled").show();
});

当然也可以

$(this).parent().parent().find(".disabled").show();


如果,有多行的话用.delegate()如下:

$("table").delegate("input.chk", "click", function(){
  $(this).closest('tr').find(".disabled").show();
});



#.delegate() instead binds one handler to the table for all of the input.chk elements to bubble up to. If you're looking to enable/disable, use hcnage and .toggle() in addition to the above, like this:
$("table").delegate("input.chk", "change", function(){
  $(this).closest('tr').find(".disabled").toggle(this.checked);
});
分享到:
评论

相关推荐

    jQuery详细教程

    演示 jQuery hide() 函数,隐藏 id="test" 的元素。 $("p").hide() 演示 jQuery hide() 函数,隐藏所有 &lt;p&gt; 元素。 $(".test").hide() 演示 jQuery hide() 函数,隐藏所有 class="test" 的元素。 jQuery 语法 ...

    js 点击页面其他地方关闭弹出层(示例代码)

    - **stopPropagation()**: 当用户点击弹出层时,事件会向上冒泡到父元素。为了防止点击弹出层时关闭它,我们调用`stopPropagation()`来阻止这一行为。这使得只有点击弹出层外部的事件才会触发关闭弹出层的逻辑。 3...

    js动态树集合

    - **父节点与子节点**:一个节点可以有零个、一个或多个子节点,而它的上级节点则称为父节点。 - **根节点**:没有父节点的节点称为根节点。 - **叶子节点**:没有子节点的节点称为叶子节点。 - **展开/折叠**:...

    jquery帮助手册+经典实例

    - **事件委托**:通过`.on()`在父元素上绑定事件,利用事件冒泡处理子元素的事件,提高性能。 3. **CSS操作**: - **样式设置**:使用`.css()`方法可以修改元素的样式属性,如颜色、大小等。 - **类操作**:`....

    css开发字典

    **Father(父元素)** - DOM树中某元素的直接上级元素。 - 可以通过`:parent`选择器来选择并应用样式。 **Dotted(点线)** - 边框样式之一,由一系列小点组成。 - 通过`border-style: dotted`属性实现。 **Filter...

    jquery 无限级下拉菜单的简单实现代码

    2. 对于每个菜单项,创建一个`&lt;li&gt;`元素并将其加入到上级`&lt;ul&gt;`中。 3. 检查当前菜单项是否有`children`属性,如果有,则在`&lt;li&gt;`内添加一个用于触发下级菜单显示的链接或按钮。 4. 如果点击了触发下级菜单显示的...

    树型答题器:树

    JavaScript可以监听用户的点击事件,改变DOM(文档对象模型)以显示或隐藏子节点。更高级的应用可能涉及AJAX(异步JavaScript和XML),通过发送后台请求获取更多数据,比如加载下一个问题或答案,而无需刷新整个页面...

Global site tag (gtag.js) - Google Analytics