2016-08-17 142 views
1

我试图让Jq听同一个onclick方法中的三个按钮,然后触发一个函数并通过$(this)调用点击的按钮;如何让onclick();听多个按钮

这里是一个示例:

$("body").on('click', 'a.home:visible', 'a.mobile:visible', 'a.phone:visible', function() { 
     var attr = $(this).attr('attr'); 


     $(this).parents('.dropdown-menu').prev().prev().text(attr); 
    }); 
+1

这是一个演示? – guradio

+0

目前,我会让所有的按钮共享相同的类,然后触发事件,因为在我的情况下,共享同一类是可能的; –

+0

等待极客们告诉如何让onclick事件听多项选择器:) –

回答

2

,你做到了基本正确。你的方法很好。但是你必须把它合并成一个字符串,而不是单个参数。而且你不需要:visible,因为你不能在click上看到不可见的元素。 ;)

$("body").on('click', 'a.home, a.mobile, a.phone', function() { 
    var attr = $(this).attr('attr'); 
    $(this).parents('.dropdown-menu').prev().prev().text(attr); 
}); 

如果元素是静态的,您甚至应该使用普通事件侦听器而不是委派。

$('a.home, a.mobile, a.phone').click(function() { 
    var attr = $(this).attr('attr'); 
    $(this).parents('.dropdown-menu').prev().prev().text(attr); 
}); 
+0

感谢您向我提供这些信息,请您介绍一下静态元素的更多内容我的意思是如何判断这个元素是静态的以便使用建议的aparoche? –

+0

静态意味着,该元素仅在创建页面时创建一次。动态元素可以通过AJAX添加或通过其他任何脚本创建。然后像你在你的例子中那样使用它。如果它们是静态的,那么第二个将是更好的选择。 @SuhaybKharabsheh – eisbehr

+0

@eisbeht所以它是动态的,因为我点击克隆手机领域越来越多,并且按钮用户点击是在DOM准备好后创建的,谢谢 –

1

把它们放在一个引号

$("body").on('click', 'a.home:visible,a.mobile:visible,a.phone:visible', function() { 
    alert('Clicked') 

}); 

JSFIDDLE