Question

我有3个按钮，我已经使用他们的calss创建了一个点击功能。

error_reporting(E_ALL);
ini_set('display_errors', '1');

我有另一个点击功能，通过传递每个案例的值（val）来触发上述点击功能（$('.abc').click(function(e, elem){ alert("triggered"); });）。

$('.abc'). click function

我的问题是，当我直接点击按钮时，警报只显示一个。但当我点击其他功能（$(".custom-menu li").click(function(){ // This is the triggered action name switch($(this).attr("data-action")) { // A case for each action. case "case1": $('.abc').trigger('click',['first']); break; case "case2": $('.abc').trigger('click',['second']); break; case "case3": $('.abc').trigger('click',['third']); break; } });）中的按钮时，警报会显示3次。仅当通过$(".custom-menu li").click(function(){点击完成时，如何才能使提醒显示一次？

$(".custom-menu li").click(function(){

Answer 1

您正在触发点击集合中的每个元素，因此您会看到警报3次，每个元素一次。

您应该仅触发单击单个元素：

$(".custom-menu li").click(function(){
     // This is the triggered action name
     switch($(this).attr("data-action")) {
     // A case for each action.
         case "case1": $('.abc:eq(0)').trigger('click'); break;
         case "case2": $('.abc:eq(1)').trigger('click'); break;
         case "case3": $('.abc:eq(2)').trigger('click'); break;
     }
});

这是一个演示。

＆＃13;

$('.abc').click(function(e, elem) {
     alert("Triggered " + $(this).text());
});

$(".custom-menu li").click(function() {
     switch($(this).attr("data-action")) {
         case "case1": $('.abc:eq(0)').trigger('click'); break;
         case "case2": $('.abc:eq(1)').trigger('click'); break;
         case "case3": $('.abc:eq(2)').trigger('click'); break;
     }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="custom-menu">
    <li data-action="case1">Item 1</li>
    <li data-action="case2">Item 2</li>
    <li data-action="case3">Item 3</li>
</div>

<div class="abc">Element 1</div>
<div class="abc">Element 2</div>
<div class="abc">Element 3</div>

＆＃13;

使trigger（）仅运行一次函数

1 个答案: