動態元素與jQuery

正如我已經做了多年，我可以使用PHP（它已從數據庫中獲得信息）創建動態HTML。動態元素與jQuery

因此，舉例來說，假設我要動態地創建鏈接x個，我的PHP腳本將結束呼應：

<a id=link1 href=>Link 1</a> 
<a id=link2 href=>Link 2</a> 
//etc....

這是罰款。但是，如何處理jQuery代碼中這些按鈕的動態特性？比方說，我想每個鏈接，彈出一個警告的「Hello World」：

$('#link1').click(function() { 
       alert("Hello World"); 
       return false; 
       });

我會重複使用PHP動態每個創建的鏈接代碼？我當然知道，這是不是做正確的事情，但是我卡上有什麼用

我感謝所有幫助

乾杯

來源

2011-04-20 jtnire

很多優秀的答案！我很想選擇一個！ :) – jtnire 2011-04-20 10:25:10

任何HTML這是一個從服務器端來了（如PHP或ASP.NET）可以治療一樣你會正常的靜態HTML。就您的瀏覽器而言，這不是動態創建的。

如果我們在客戶端上討論動態創建的元素（如使用Javascript/jQuery創建鏈接），那完全是另一回事。例如，您必須調整您的Javascript來解決這個問題，比如使用.delegate()和.live()，而不是僅僅使用香草.bind()調用。

至於你就在一次針對多個元素的問題，語義的方式來做到這一點是類。所以，像

<a href="#" id="link1" class="foo">Linky linky</a> 
<a href="#" id="link2" class="foo">Linky linky</a> 
<a href="#" id="link3" class="foo">Linky linky</a>

可以立刻通過一些有針對性的像

$('a.foo').click(function() { 
    alert(); 
});

此外，如果你想從下面進入實際的URL阻止鏈接點擊，jQuery的可以很容易爲你使用這個代替return false;：

$('a.foo').click(function(e) { 
    alert(); 
    e.preventDefault(); 
});

你也可以撥打e.stopPropagation()停止事件冒泡到父元素，如果你願意。有時候，我認爲return false功能過多太多了。

來源

2011-04-20 10:16:03

我選擇這個作爲答案，因爲作者進一步了幾步:)所有其他答案都很好，但謝謝！ – jtnire 2011-04-20 10:28:40

沒有，你可以分配的最佳方法一類到你的鏈接，並用它來連接點擊功能

<a class='links' id=link1 href= '#' >Link 1</a> 
<a class='links' id=link2 href='#' >Link 2</a> 

$('a.links').click(function() { 
       alert("Hello World"); 
       return false; 
       });

來源

2011-04-20 10:10:06

您可以添加一個類的每一個環節，並使用類綁定你的事件代碼。

$(".DynamicLinks").click(function() { 
        alert("Hello World"); 
        return false; 
        });

來源

2011-04-20 10:12:18

如果所有所需的ID共享相同的前綴（這裏是link），這是沒有問題的。有一個選擇的「開頭」：這裏

// This will select all a-elements where the id starts with "link" 
$('a[id^="link"]').click(function(event){ 
    alert("Hello World"); 
    return false; 
});

查找進一步的例子：http://api.jquery.com/attribute-starts-with-selector/

來源

2011-04-20 10:12:29

添加聊天關於'類'，我會upvote你。有幾種方法可以解決OP的問題。 – 2011-04-20 10:14:31

動態元素與jQuery

回答

相關問題