优雅的方式来访问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选择

回答

相关问题