javascript – onclick事件在onchange之前触发时未触发

我这里有一个有趣的问题.

我有一个textarea与onchange事件链接到它.
然后我有一个链接到onclick事件的按钮.

当在textarea上触发onchange事件时,将处理放入textarea的文本.这通常发生在我点击textarea之外的东西时.

我做的是以下内容:

>我在textarea中输入了一个文本.
>输入后,我点击按钮触发按钮上的onclick事件
>没有任何反应,但是当我点击按钮时,textarea上的onchange事件被触发,但是按钮上的onclick事件本身并没有被触发.

为什么?我希望触发onchange和onclick.有什么我需要做的,所以单击按钮不会“丢失”.我意识到我必须点击两次,因为第一次单击导致textarea上的onchange,然后第二次单击触发按钮上的onclick.

下面的代码显示了一个例子,只需尝试下面的代码即可.键入文本,然后直接单击该按钮.只会出现“textarea”弹出窗口.

<textarea onchange="processText();" name="mytext"></textarea>
<button onclick="processButton();">Hello</button>
<script language="Javascript">
  function processText()
  {
    alert( 'textarea');
  }

  function processButton()
  {
    alert( 'button');
  }
</script>

解决方法:

你需要重新检查你的假设.在您的示例中,alert()会中断程序流程,从而中断onclick的处理.此代码(jsfiddle here)演示默认情况下onchange不会干扰onclick:

<textarea onchange="processText();" name="mytext"></textarea>
<button onclick="processButton();">Hello</button>
<div id="clicked"></div>
<div id="changed"></div>
<script language="Javascript">
  function processText()
  {
    document.getElementById('changed').innerHTML = "onchange fired";;
  }

  function processButton()
  {
    document.getElementById('clicked').innerHTML = "onclick fired";
  }
</script>​

我遇到了类似的问题,但是没有处理onclick事件的实际原因是被点击的元素,由于onchange处理程序而向下滚动.释放鼠标按钮后,该元素未收到mouseup事件,并且“click”被中断.

上一篇:antd之Input的onChange坑


下一篇:javascript – jqtransform表单选择器(onchange)问题!