两个click事件

我有一个警告表格单元格的单击事件是这样的：两个click事件

<table> 
<tr> 
<td id="cid" onclick="alert('I want to run 2nd!')">Test</td> 
</tr> 
</table>

后来我想在同一个元素的事件处理程序（点击）添加新的警报使用jQuery这样的：

<script> 
$('#cid').on('click',function() { alert('I want to run 1st!'); }); 
</script>

当我运行代码，我得到2个警报（如预期），但不与通缉令。第二次警报应该首先出现在第一秒钟。
最后TD我想要的是：

<table> 
<tr> 
<td id="cid" onclick="alert('I want to run 1st!');alert('I want to run 2nd!')">Test</td> 
</tr> 
</table>

我试图执行这些代码（从其他职位）：

<script> 
var clcks = $('#cid').data('events').click.slice(); 
var cid = $('#cid').unbind('click'); 
$.each(clcks.reverse(), function() { cid.click(this); });  
</script>

，但结果是一样的。
我在做什么错？

来源

2017-04-25 Panos

您正在使用onclick属性。 –

你能更具体！我正在使用onclick属性，但那是什么意思？ – Panos

事件注册优先于外部（不显眼）事件的内联声明事件。所以在你的情况下，首先执行onclick="alert('I want to run 2nd!')，然后$('#cid').on('click',function() { alert('I want to run 1st!'); 如果你想按照你的要求来实现它，你需要创建一个函数并根据你的偏好调用警报，不管是使用第一种还是第二种方法。另外，作为一种好的做法，尽量避免内联事件。你变得相对更快，更容易维护。

来源

2017-04-25 12:58:29

你的建议不起作用。此外，.stopPropagation（）将停止存在的onclick事件，这一点我不想要！ – Panos

@Panos请检查我的更新答案。 –

正如我所说，我无权更改内联事件。所以，我需要找到一种方法在它被触发之前捕获它，放入一个函数，首先添加我想要的事件，然后释放存在的事件。 – Panos

<!-- HTML--> 
    <!DOCTYPE html> 
    <html> 

    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    </head> 

    <body> 
     <div id='button' style='width:40px;height:40px;background-color:red;'></div> 
    </body> 

    </html> 

// JS 
$(function(){   
    $("#button").bind('click',first); 
    $("#button").bind('click',second); 
    $("#button").bind('click',third); 

    var clicks = $('#button').data('events').click.slice(); 
    var button = $('#button').unbind('click'); 
    $.each(clicks.reverse(), function() { 
     button.click(this); 
    });  
}); 

function first() { alert("first"); }; 
function second() { alert("second"); }; 
function third() { alert("third"); };

来源

2017-04-25 12:59:32 Ananya

此代码使用jQuery创建三个onclick事件并处理它们。我的第一个onclick事件是td元素中的一个属性，由于某些原因，我不知道这个代码不工作！ – Panos

我会使用数据和jQuery时，这样做，以支持无限数量的元素。此外，请确保您的td位于tr和table之内，因为如果没有这两个容器，它将无法正常运行。

$("#cid").click(function() { 
 
    $("#cid").unbind("click").attr("onclick","").click(function() { 
 
    console.log('I want to run 2nd!'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
<tr><td id="cid" onclick="console.log('I want to run 1st!')">Test</td></tr> 
 
</table>

来源

2017-04-25 13:01:09 Neil

再次相同....警报（'我想运行第二！'）已经存在于td元素中。只有警报（'我想运行1st！'）是用jQuery创建的，这就是它应该保留的方式。 td元素在tr和一个表元素中。 – Panos

@Panos更新，如果你可以标记为解决方案，它会帮助很多。 – Neil

它不能按我的要求工作。我只需点击一下即可触发创建的警报，然后触发内联警报。 – Panos

嗯，我设法看着办吧！
下面的代码不正是我想要的：

<table><tr></tr><td id="cid" onclick="alert('I want to run 2nd!')">Test</td></tr></table> 
<script> 
document.getElementById("cid").setAttribute("onclick","alert('I want to run 1st!');"+document.getElementById('cid').getAttribute('onclick')); 
</script>

希望它能帮助。

来源

2017-04-27 06:31:51 Panos

两个click事件

回答

相关问题