Question

jquery 选择器，如何选择本子元素的父元素下的另一个子元素。

<ul>
<div class="aaa">
<li class="bb1">haha</li>
<li class="bb2">click me</li>
<li class="bb3">haha</li>
<div class="ccc">哈哈</div>
</div>

<div class="aaa">
<li class="bb1">haha</li>
<li class="bb2">click me</li>
<li class="bb3">haha</li>
<div class="ccc">哈哈</div>
</div>
</ul>

当我点击 .bb2 整个 li 的时候，this 对应父容器 .aaa 下的 .ccc 得到操作，不会影响到其他!

我采用的是这样的理解：

$(document).ready(function() {
$(".bb2").click(

function(){
$(this).parents(".aaa").$(".ccc").slideToggle("slow");
}

);
});

但是无法得到实现！~

请高手指点！

Answer 1

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：index.html，并引入jquery，填充问题基础代码。

2、在index.html中的<script>标签，输入jquery代码：

$('.bb2').click(function () {

$('body').append($(this).parent().find('.ccc').text());

});

3、浏览器运行index.html页面，点击“click me”的条目，此时会成功打印出“哈哈”的内容。

Answer 2

jQuery的parent()方法可以获得当前匹配元素集合中每个元素的父元素，因此可以用以实现选择当前元素的父元素下的另一个子元素。下面给出实例演示：

1、创建Html元素

<div class="box">
	<span>实例演示：获取当前点击li标签的父标签下类型为bb4的子标签</span><br>
	<div class="content">
		<ul>
			<li class="bb1">哈哈，我是bb1</li>
			<li class="bb2">click me</li>
			<li class="bb3">哈哈，我是bb3</li>
			<li class="bb4">哈哈，我是bb4</li>
		</ul>
	</div>
</div>

2、设置css样式

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.box>span{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
li{margin:5px;list-style: none;}

3、编写jquery代码

$(function(){
	$("li").click(function() {
		alert($(this).parent().find(".bb4").html());
	});
});

4、观察效果：点击任一个li标签都将弹出最后一个li标签的文字

Answer 3

//抱歉，刚才没有看清题目。下面一句代码即可。
//找到自己的父元素，通过父元素找到自己的父元素下面的唯一div
//不会影响到父元素以外的div
//.parent()只会找到唯一的顶头父级元素。不需要加查询器。
$(this).parent().find('div')

//用下面这句也可以。因为只有唯一一个兄弟元素是div
$(this).siblings('div')

Answer 4

把$(this).parents(".aaa").$(".ccc").slideToggle("slow");

改成：

$(this).parent(".aaa").find(".ccc").slideToggle("slow");

追问

有效果，非常感谢你，但是 工程师首岳 先给了方法，就采纳了他的

追答

看回答时间，我是第一个回答的啊 - -

Answer 5

$(".bb2").click(function(){
	$(this).parent().find(".ccc").slideToggle("slow");
});

希望可以帮到你！

追问

有效果，非常感谢你，但是 工程师首岳 先给了方法，就采纳了他的