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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5786799/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 18:50:43  来源:igfitidea点击:

How to detect textbox change event from javascript

javascriptasp.net

提问by Ulhas Tuscano

I have a textbox asp.net server control. I am modifying the value of textbox from javascript i want to detect when the textbox text is changed. I tried onchange event which gets called on lost foucs when the text changes. But in my case i an changing text from Javascript. how can i achieve this?

我有一个文本框 asp.net 服务器控件。我正在从 javascript 修改文本框的值,我想检测文本框文本何时更改。我尝试了 onchange 事件,当文本更改时,它会调用丢失的 foucs。但就我而言,我是来自 Javascript 的不断变化的文本。我怎样才能做到这一点?

回答by alex

Updating the valueproperty won'ttrigger the change event. The change event is triggered by the user.

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

You can either write a function which changes the value and does whatever else you need to do...

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

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

...or poll the textarea's value...

...或轮询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);
})();

...or explicitly call the onchange()event yourself.

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

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

(Assuming you set the event up with onchangeproperty.)

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

The workarounds are not terribly great solutions. Either way, you need to do some intervention to trigger extra code when updating a textarea's valueproperty.

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

回答by Marthin

You could force a postback from javascript and hence forcing a page reload event. In the Page.GetPostBackEventReference() you can handle the event and perhaps fire some other event.

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

This is not a good solution thougth and I truly recommend that you do it all thru javascript or drop the javascript and let .NET hadle everything, perhaps with Ajax.NET

这不是一个好的解决方案,我真的建议您全部通过 javascript 或放弃 javascript 并让 .NET 处理所有事情,也许使用 Ajax.NET

The following linkexplains hwo you do it for a normal button, but it shouldn't be to hard to make it for a onchange event.

以下链接解释了您如何为普通按钮执行此操作,但为 onchange 事件制作它应该不难。

回答by Cos Callis

Using Jquery you can assign a 'change' handler and invoke the handler like this:

使用 Jquery,您可以分配一个“更改”处理程序并像这样调用处理程序:

<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>

回答by ianace

If you could use jQuery, it would be something like this

如果你可以使用jQuery,它会是这样的

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