如何从javascript中检测文本框更改事件

时间:2011-04-26 06:30:30

标签: javascript asp.net

我有一个文本框asp.net服务器控件。我正在修改文本框的值,我希望检测文本框文本何时更改。我尝试了onchange事件,当文本发生变化时会调用丢失的信息。但在我的情况下,我从Javascript更改文本。我怎么能做到这一点?

4 个答案:

答案 0 :(得分:6)

更新value属性不会触发更改事件。更改事件由用户触发。

您可以编写一个更改值的函数,并执行您需要执行的任何操作...

function changeTextarea(str) {
   document.getElementById('a').value = str;
   // Whatever else you need to do.
}

...或推荐textarea的价值......

(function() {
   var text = getText();   
   var getText = function() {
      return document.getElementById('a').value;
   }  

   setInterval(function() {
      var newtext = getText();
      if (text !== newText) {
          // The value has changed.
      }
      text = newText; 
   }, 100);
})();

...或者自己明确调用onchange()事件。

document.getElementById('a').onchange();

(假设您使用onchange属性设置了事件。)

解决方法并不是非常好的解决方案。无论哪种方式,在更新textarea的{​​{1}}属性时,您需要进行一些干预以触发额外的代码。

答案 1 :(得分:0)

你可以强制从javascript回发,从而强制页面重新加载事件。在Page.GetPostBackEventReference()中,您可以处理该事件,并可能触发其他一些事件。

这不是一个好的解决方案,我真的建议你通过javascript或删除javascript并让.NET包含所有内容,也许使用Ajax.NET

以下link解释了你为正常按钮做了什么,但是对于onchange事件来说不应该很难。

答案 2 :(得分:0)

使用Jquery,你可以分配一个'change'处理程序并调用这样的处理程序:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //makes 'DetectChange' the handler when TextBox1 changes...
            $('#TextBox1').change(function () {
                DetectChange();
            });
         });

        function DetectChange() {
            alert("TextBox1 has been changed");
        }

        function ClickTheButton() {
            // .val actually 'changes the value'
            // while you have to add .change() to invoke the actual change event handler...
            $('#TextBox1').val("Changed When Button Clicked").change();

            //return false prevents the click event of the button from doing a post back
            //keeping everything on the client for this sample..
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <input id="Button1" type="button" value="Change TextBox1" onclick="return ClickTheButton();"  />
    </div>
    </form>
</body>
</html>

答案 3 :(得分:-1)

如果你可以使用jQuery,那就是这样的

$('#id_of_text_area').change(function(){
    //do something
});