Question

这可能是一个非常常见的问题，但我自己无法找到答案;

我的所有列表元素都像这样调用函数setQuery

onClick="admin_stats.setQuery(this);"

而不是[hardcode]将此添加到每个列表元素，有没有办法在单击列表元素时运行它？

我对jQuery Live或绑定/解除绑定不太熟悉，但我认为他们会在这里发挥作用？

在重新塑造一个相当方形的轮子之前，我想我可能会问=）

<小时/> 编辑：我的列表元素看起来像

<ul>
    <li id="usersPerMonth" onClick="admin_stats.setQuery(this);">Users per Month</li>
    <li id="statsByUser" onClick="admin_stats.setQuery(this);">Stats by User</li>
</ul>

然后使用this.attr（“id”）从json样式的变量中查找实际的SQL文本：

queries : {
    usersPerMonth : " ... some sql ...",
    statsByUser   : " ... some sql ...",
    ...
}

这就是为什么我有这样命名的div（我愿意接受设计建议）

Answer 1

$(function() {
    $('#myList').delegate('li', 'click', function() {
        admin_stats.setQuery( this );
    });
});

这假设您的<ul>元素的ID为myList。它将在任何<li>元素上处理其中的点击，调用您的函数，并传递this作为参数。

.delegate()代码包含在$(function() {});中，因此在DOM准备就绪之前它不会运行。这是jQuery的.ready()函数的快捷方式。

Answer 2

是的 - 使用这样的jQuery：

$('li').live("click", function(event){
    admin_stats.setQuery(event.target);
});

这假设您要将其设置为每个li元素。您可以在此处找到live的文档：http://api.jquery.com/live/

live会确保传递给它的所有元素在指定的函数中始终具有click处理程序。

Answer 3

jQuery可能是你最好的选择。您是否即时添加新元素，或者当附件准备就绪时元素是否存在？如果它们是“satic”的意思是一旦页面被加载就可以了，你可以使用：

$(document).ready(function(){
  $('li').bind('click',function(e){ // may need to change the selector to be more specific
    admin_stats.setQuery(this);
  });
});

Answer 4

需要触发onClick ...所以：

 $('li').click(function(){
     admin_stats.setQuery($(this));
 });

Answer 5

在jQuery中，您可以使用CSS样式选择器选择元素（如果不添加更多元素，则可以使用此元素;这使用.click()）：

$(function() {
    $('#liContainer li').click(function() {
        admin_stats.setQuery(this);
    });
});

我们把整个事情放在$(function() { ... });里面，因为在绑定事件处理程序之前页面需要准备好。或者，如果添加更多元素，您可以这样做。这使用.delegate()：

$(function() {
    $('#liContainer').delegate('li', 'click', function() {
        admin_stats.setQuery(this);
    });
});

当用户单击任何列表元素时运行一个函数

5 个答案: