jQuery的：動態事件如何實現

什麼是最好的方式來做這個動態事件鏈接div之間的jquery。jQuery的：動態事件如何實現

我的HTML頁面：

<html> 
<body> 
<div id="parent1"></div> 
<div id="parent2"></div> 
<div id="parent3"></div> 
<div id="child1"></div> 
<div id="child2"></div> 
<div id="child3"></div> 
</body> 
</html>

每個點擊父我想.toggle其子

例::如果parent2點擊，.toggle將在的child2只適用

我的父母和孩子的div是動態創建的，所以他們的數量不是靜態的，我認爲.live應該用在這裏，但我不知道如何實現這一點。

謝謝

來源

2010-02-15 trrrrrrm

這應該這樣做，使用rel屬性來記下鏈接。您也可以通過解析ID等做同樣的事情，但我覺得這個解決方案更多的語義（如果它意味着什麼）：

<html> 
<body> 
<div id="parent1" class="parents" rel="child1"></div> 
<div id="parent2" class="parents" rel="child2"></div> 
<div id="parent3" class="parents" rel="child3"></div> 
<div id="child1"></div> 
<div id="child2"></div> 
<div id="child3"></div> 
</body> 
</html> 

jQuery(function(){ 
    jQuery(".parents").live("click", function(){ 
    jQuery("#"+jQuery(this).attr("rel")).toggle(); 
    }); 

});

來源

2010-02-15 11:04:24 marcgg

使用這些div類，並使用類選擇。

$(".divclass").live ("click" , function() { 
    $(this).find("yourchildelementselector").toggle(); 
});

如果它的父子關係，那麼最好把子div放在父元素內。

<div id="parent1" class="parent"><div id="child1" class="child"></div></div> 
<div id="parent2" class="parent"><div id="child2" class="child"></div></div> 
<div id="parent3" class="parent"><div id="child3" class="child"></div></div>

，你可以調用click事件作爲

$("div.parent").live ("click" , function() { 
     $(this).find("div.child").toggle(); 
});

來源

2010-02-15 11:04:36 rahul

這將與當前的結構工作（另一種選擇是提取數，相同的一般想法）：

$("[id^=parent]").live('click', function(){ 
    var childId = this.id.replace('parent', 'child'); 
    $('#' + childId).toggle(); 
});

來源

2010-02-15 11:13:08 Kobi

使用startsWith選擇器和稍微修改的ID值，因爲下劃線字符消除了對正則表達式的需求：

<div id="parent_1" class="parents"></div> 
<div id="parent_2" class="parents"></div> 
<div id="parent_3" class="parents"></div> 
<div id="child_1"></div> 
<div id="child_2"></div> 
<div id="child_3"></div> 

$("div[id^=parent]").click(function() { 
    $('#child_' + $(this).attr('id').split('_')[1]).toggle(); 
});

我也喜歡@ Kobi的方法。

來源

2010-02-15 11:16:16 karim79

jQuery的：動態事件如何實現

回答

相關問題