優雅的方式來訪問jQuery選擇

比方說，我有HTLM這樣的：優雅的方式來訪問jQuery選擇

<ul id="citylist"> 
    <li>Seoul</li> 
    <li>Brisbane</li> 
    <li>Busan</li> 
</ul>

如果我想要一個click事件綁定到<li>元素，我會寫的JavaScript這樣的：

var $cityList = $('#citylist'); 

$cityList.delegate('li', 'click', function() { 
    //.. I want to access to $cityList 
});

如果我想從內部處理函數訪問選擇器，有沒有優雅的方式來訪問$cityList而不使用$cityList？

更新

我做了一些錯誤，同時使例子。我必須將事件綁定到<li>。

來源

2011-09-21 Sanghyun Lee

如何'$（這）'這樣做呢？ –

你用'$（this）'試過了嗎？或者你需要選擇器字符串？ –

如果你絕對不要訪問$cityList可以使用.closest()

var $cityList = $('#citylist'); 

$cityList.delegate('li', 'click', function() { 
    console.log($(this).closest('#citylist')); 
});

或者你可以用這樣的回調（並通過$citylist）：

var $cityList = $('#citylist'); 

$cityList.delegate('li', 'click', (function (parent) { 
    return function() { 
    // parent will be $citylist, this will be the li 
    console.log(arguments, evt, this, parent); 
    }; 
})($cityList));

來源

2011-09-21 08:00:26 Yoshi

-1

var $cityList = $('#citylist'); 

$cityList.find('li').click(function() { 
    // click event handler 
});

你可以絕對和更有效地使用處理函數中的$ cityList。

來源

2011-09-21 07:04:19 Rickard

等一下。什麼？綁定點擊點擊？ – mekwall

對不起，修正了 – Rickard

你想用'.children'代替'.find'，否則你也會綁定到任何嵌套的'li'元素。 – mekwall

請注意，您並未綁定click()至li元素，而是綁定到ul元素。如果你想只綁定的#citylist使用直接後裔這

$('#citylist li').click(function() { 
    // code here 
});

：

$('#citylist > li').click(function() { 
    // code here 
});

來源

2011-09-21 07:06:06

JavaScript有閉包，所以如果你這樣做：

這綁定到li元素

var $cityList = $('#citylist'); 

$cityList.children().click(function() { 
    // you can already access $cityList like this: 
    $cityList.myFunction(); 
});

來源

2011-09-21 07:13:40 Matthew

-1

我認爲最好的辦法之一是綁定你想要的和你的瑟您正在尋找的選擇是：

$('li', 'ul#citylist').bind('click', function() 
{ 
    if($(this).parent().is('ul#citylist')) alert('I am #citylist!'); 
});

以$（「禮」，「UL＃citylist」）你告訴jQuery的，你要選擇的元素和它的母公司，這樣的jQuery會發現快了你想選擇的元素（jQuery中的選擇器總是有2個參數，但最後一個，父選擇器通常被遺忘）。

要從事件中選擇#citylist你只需要reffer的元素的父誰觸發事件（$（本））

希望這有助於

來源

2011-09-21 07:34:11

@downvoter downvote的任何意見/反饋/意見/論據？ –

您可以通過修改處理器的上下文

var $cityList = $('#citylist'); 

$cityList.delegate('li', 'click', $.proxy(function(event) { 
    console.log(event.currentTarget, this.parentObj, this.parentObj.selector); 
}, $.extend(this, { 
    parentObj: $cityList 
})));

例如在jsfiddle

來源

2011-09-21 08:00:48

優雅的方式來訪問jQuery選擇

回答

相關問題