Question

我有一个带有onchange事件的输入文本，该事件调用一个显示警告框的函数。我还有一个按钮，其onclick调用不同的功能。如果用户对输入文本进行了更改并立即单击该按钮，则会触发onchange事件，显示警告框，但是按钮的onclick功能中的代码不会执行。我已经读到这与事件冒泡有关，但我还没有看到任何解决方案。有解决方案吗？它甚至可能吗？

这是一个小例子：

<input type = "text" onchange = "showAlert1()">
<input type = "button" id = "al2" value = "Click Here" onclick = "showAlert2()">

<script type = "text/javascript">

function showAlert1() 
{
    alert("ONE")
}

function showAlert2() 
{
    alert ("TWO");
}

</script>

如果对输入值进行了更改并且用户立即单击该按钮，则onclick事件处理程序showAlert2（）不会触发。我想，你在输入字段上写了一些东西，点击立即按钮然后触发

警告（“ONE”）和警报（“TWO”）......

或仅

警报（ “二”）

Answer 1

据我所知，这不是冒泡的问题（这是onchange的问题，但在这种情况下是红鲱鱼）。问题是更改字段值后点击按钮会触发blur，导致showAlert1()在按钮的onclick被触发之前运行。

这是一个简单的例子，它按照你描述的方式工作，但你会发现它不是一个不可靠的黑客。基本上它会缓冲每个函数的执行，以便可以触发按钮的onclick。但是，如果您通过setTimeout()单击并按住按钮的时间长于每个函数中设置的缓冲区，则会失败。

function showAlert1() {
    setTimeout(function(){ alert("ONE") }, 250);
}

function showAlert2() {
    setTimeout(function(){ alert("TWO") }, 250);
}

演示：jsfiddle.net/5rTLq

Answer 2

这个怎么样

function showAlert1(a) {
    alert(a.value); /* use setTimeout to delay */
}

function showAlert2() {
    alert(document.getElementById('txt').value);
}

测试：http://jsfiddle.net/C3jRr/2/

用户立即单击按钮后，onchange输入字段后按钮onclick不会触发

2 个答案: