您應該考慮使用類的元素,然後將該類作爲插件的查詢選擇器來使用。
例如:
<a class="myLink" href="#">a</a>
<a class="myLink" href="#">a2</a>
然後,您可以使用以下的jQuery:
$('.myLink').on('click', function(e) {
$("#showThis").doSomething();
});
您也可以通過衆多的ID添加到jQuery的構造函數使用逗號,例如:
$('#id1, #id2, #etc')
您可以使用功能:
$('#id1').add('#id2');
或者,你可以使用一個<ul>
元素,然後委託click
事件中它的動態<li>
項目。例如,考慮下面的標記:
<ul class="mylist">
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
您可以使用on()
與ul.mylist
,因爲.mylist
是最接近靜態父:
$('ul.mylist').on('click', 'li', function(e) {
$("#showThis").doSomething();
});
使用最後一個例子可能是最好的解決方案。它將處理在客戶端添加到DOM的任何<li>
元素上的click
事件(例如可能通過jQuery或原始JavaScript)。
如果您需要訪問該事件處理程序內id
屬性(比如你想從格式user4
訪問用戶ID,您可以使用:
<a class="myLink" id="user1" href="#">User 1</a>
<a class="myLink" id="user2" href="#">User 2</a>
<a class="myLink" id="user3" href="#">User 3</a>
你的jQuery反過來會看起來像:
$('.myLink').on('click', function(e) {
var userId = this.id.replace('user', '');
});
這可能隨後又被用來生成另一選擇爲doSomething()
,例如:
$('.myLink').on('click', function(e) {
var userId = this.id.replace('user', '');
$('#showThis'+userId).doSomething();
});
這裏是jsFiddle Demo。
那類是什麼 – adeneo
你能給我一個例子嗎?我對jquery很沒有經驗 – pimeys
@pimeys請看我的回答。 – BenM