-2

我有 2 个div元素，如果我单击第一个 div，那么单击的 div 内的另一个 div 是否应该显示，但我不明白它的工作原理，我的 jquery 代码是这样的：

jQuery('.infobutton').click(function(){
    var clickedID = jQuery(this).attr('id');
    jQuery(clickedID).children('div').toggle(); 
});

<div class="infobutton" id="infobtn1">
    <div class="content">some content</div>
</div>

我每次都得到正确的ID ，我也尝试过.first()，，.parent().children('.content')

可以用 jQuery 做到这一点吗？

4

3 回答 3

1

假设您有这样的 HTML：

<div id="container" class="infobutton">
    Some content
    <div>Some other content</div>
</div>

现在让我们来看看你的 Javascript：

jQuery('.infobutton').click(function(){

使用类查找元素infobutton并分配click处理程序。这工作正常。

var clickedID = jQuery(this).attr('id');

将该元素的放入id变量 中clickedID。的值clickedID现在是container。

jQuery(clickedID).children('div').toggle();

运行 jQuery 选择器clickedID。这就是我们的问题。这可以归结为jQuery('container'). 这会查找带有标签名称的元素container，而不是带有 ID的元素container。

事实上，解决这一切的方法是根本不使用 ID。相反，您可以使用 构建 jQuery 对象this，它是对单击元素的引用：

jQuery('.infobutton').click(function(){
    jQuery(this).children('div').toggle(); 
});
于 2013-11-05T15:50:27.827 回答
0

事件处理程序内部this将引用处理程序附加到的元素

jQuery('.infobutton').click(function(){
    jQuery(this).children('.content').toggle(); 
});

演示：小提琴

于 2013-11-05T15:48:01.343 回答
0

使用这个

jQuery('.infobutton').click(function(){
    jQuery(this).children('.content').toggle(); 
});

this指事件中的当前元素。

您的代码将作为

使用jQuery('#'+clickedID) 而不是jQuery(clickedID)

于 2013-11-05T15:48:19.603 回答