如何避免在更改和点击之间触发虚假功能

问题描述

我有一个input一个清晰的button。如果用户在输入字段中输入内容并使其模糊,change()将被触发并执行某些操作。但是,如果我想单击清除button并触发click()change()仍将被触发。我该如何解决

我尝试了这个,但是没有用。 var clear永远不会正确。

$("#inputid").change(function() {
  var clear = false;
   $("#clearbtn").click(function() {
     // if clear button is clicked,do something
     clear = true;
   });
   if (clear) {
     return;
   }

   // if clear button is not clicked,do something else
...


解决方法

您应将 click 事件移到 change 事件之外。

$("#clearbtn").click(function() {
  // if clear button is clicked,do something
  $("#inputid").val("");
});
,

这很棘手
问题是在调用onchange事件之前先调用clear button click事件
为了克服这个问题,您可以在onchange事件中引入一个计时器,以便它等待用户的立即执行
像这样:

$(document).ready(function(){
  var clear = false;
  var isTimerOn = false;
  function HandleChange(){
    if(clear){
     // if clear button is clicked,do something
     $("#inputid").val("");
    }else{
     // if clear button is not clicked,do something else
     alert("do something else");
    }
    clear = false;
    isTimerOn = false;
  }
  
    $("#inputid").change(function() {
    isTimerOn = true;
    setTimeout(HandleChange,80);
  });
   
   $("#clearbtn").click(function() {
     clear = true;
     if(!isTimerOn){
        HandleChange();
     }
   });
});

这是小提琴:https://jsfiddle.net/6d9r1qsc/