如何在javascript中处理输入元素状态的编程式更改

我遇到了奇怪的问题。当用户更改表单上的复选框输入元素时，会产生足够的事件编程更改。我应该如何面对这个挑战？下面的代码：如何在javascript中处理输入元素状态的编程式更改

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js"></script> 
    <script type="text/javascript"> 
    jQuery(document).ready(
     function() {   
     jQuery("#cb").change(
      function() { 
      alert("Changed!"); 
      return true; 
      } 
     ); 
     jQuery("#b").click(
      function() { 
      var newState = !jQuery("#cb").attr('checked'); 
      jQuery("#cb").attr('checked', newState); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <form action="#"> 
    <p> 
     <input type="button" id="b" /> 
     <input type="checkbox" id="cb" /> 
    </p> 
    </form> 
</body> 
</html>

更新我不控制元素的变化，我只需要处理它们。这是我写的通用计划代码。

来源

2008-12-30 Artem Tikhomirov

这是不可能的JavaScript语言中的跟踪对象的状态，因为它可以做在Objective-C（KVO）中。也不可能使用DOM功能--DOM不会在每个属性更改上触发事件 - 相反，它仅触发某些用户操作的事件：鼠标单击，按键或页面生命周期及其派生。

每次她修改某些属性时，都可以实现只有触发事件。当然，这可以用AnthonyW琼斯提到的功能来封装。

来源

2010-01-20 15:27:14

在这种情况下，您不应该在事件处理函数本身中编写逻辑。你应该把任何这样的逻辑放在一个单独的函数中。同样，你不应该把代码，在代码的其它顺序编程直接操纵的复选框值，但它抽象成另一个功能： -

jQuery(document).ready(
    function() { 

    jQuery("#cb").change(
     function() { 
     changeLogicForcb.call(this); 
     return true; 
    } 
    ); 

    jQuery("#b").click(
     function() { 
     togglecb();    
     }); 

    function changeLogicForcb() 
    { 
     //something actually sensible here 
     alert("changed!"); 
    } 

    function togglecb() 
    { 
     var cb = jQuery("#cb"); 
     var newState = !cb.attr('checked'); 
     cb.attr('checked', newState); 
     changeLogicForcb.call(cb.get(0));   
    } 

    });

来源

2008-12-30 13:11:59 AnthonyWJones

使用触发功能触发上的复选框单击事件。您不需要获取现有状态，因为该复选框只会通过点击进行切换。

jQuery("#cb").trigger('click');

来源

2008-12-30 13:12:49 tvanfosson

在问题和标签中没有提到jQuery。 – Alternatex 2015-10-16 11:53:13

jQuery核心库方法.val（）不触发change事件。如果您提供自己的jQuery副本，则可以修改库方法，但这可能不是明智之举。相反，你可以添加自己的价值制定者，它利用.VAL（），同时也有大意如下的东西烧成更改事件：

jQuery.fn.xVal = (function() { 
    return function(value) { 
     // Use core functionality 
     result = this.val.apply(this, arguments); 
     // trigger change event 
     if (result instanceof jQuery) { 
       result.change(); 
     } 
     return result; 
    }; 
})();

来源

2010-01-19 14:42:59

如何在javascript中处理输入元素状态的编程式更改

回答

相关问题