jQuery - 关于更改输入文本

时间:2012-05-03 19:49:49

标签: jquery onchange textinput

我正在尝试创建一个在text input field的值更改时执行的函数。单击表格单元格时,字段的值会更改,而不是keyup,也不会粘贴。我试过这样的话:

$("#kat").change(function(){ 
    alert("Hello");
});

我有文字字段:

<input type="text" id="kat" value="0"/>

但它不起作用。有帮助吗?

10 个答案:

答案 0 :(得分:26)

这是对jQuery文档页面的评论:

  

在较早的HTML5之前的浏览器中,“keyup”绝对是您正在寻找的。      

在HTML5中有一个新事件“输入”,其行为与您认为“更改”本应表现完全相同 - 因为只要按下某个键将信息输入到表单中就会触发。

     。

$( '元素')结合( '输入',功能);

答案 1 :(得分:9)

对我而言,就像你正在更新javascript中文本字段的值。仅当您从文本字段中键入数据和制表符时,才会触发onchange事件。

一种解决方法是在从脚本修改文本框值时触发文本框更改事件。见下文,

$("#kat").change(function(){ 
    alert("Hello");
});


$('<tab_cell>').click (function () {
   $('#kat')
      .val($(this).text()) //updating the value of the textbox 
      .change();           //trigger change event.
});

答案 2 :(得分:9)

这项技术对我有用:

$('#myInputFieldId').bind('input',function(){ 
               alert("Hello");
    });

请注意,根据this JQuery doc,建议使用“on”而不是在较新版本中绑定。

答案 3 :(得分:5)

这对我有用

var change_temp = "";
$('#url_key').bind('keydown keyup',function(e){
    if(e.type == "keydown"){
        change_temp = $(this).val();
        return;
    }
    if($(this).val() != change_temp){
        // add the code to on change here 
    }

});

答案 4 :(得分:4)

jQuery文档说“如果您更改字段中的文本然后单击”也会显示[处理程序执行结果]。但是如果字段失去焦点而内容没有更改,则事件不会被触发。“

尝试keyup和keydown事件,如下所示:

$("#kat").keydown(function(){ 
   alert("Hello");
});

答案 5 :(得分:3)

function search() {
        var query_value = $('input#search').val();
        $('b#search-string').html(query_value);
        if(query_value !== ''){
            $.ajax({
                type: "POST",
                url: "search.php",
                data: { query: query_value },
                cache: false,
                success: function(html){
                    //alert(html);
                    $("ul#results").html(html);
                }
            });
        }return false;    
    }

    $("input#search").live("keyup", function(e) {
        clearTimeout($.data(this, 'timer'));

        var search_string = $(this).val();

        if (search_string == '') {
            $("ul#results").fadeOut();
            $('h4#results-text').fadeOut();
        }else{
            $("ul#results").fadeIn();
            $('h4#results-text').fadeIn();
            $(this).data('timer', setTimeout(search, 100));
        };
    });


and the html 
<input id="search" style="height:36px; font-size:13px;" type="text" class="form-control" placeholder="Enter Mobile Number or Email"  value="<?php echo stripcslashes($_REQUEST["string"]); ?>" name="string" />
        <h4 id="results-text">Showing results for: <b id="search-string">Array</b></h4>
        <ul id="results"></ul>

答案 6 :(得分:1)

我最近想知道为什么我的代码不起作用,然后我意识到,我需要在文档加载后立即设置事件处理程序,否则当浏览器逐行加载代码时,它会加载JavaScript ,但它还没有为其分配事件处理程序的元素。 在你的例子中,它应该是这样的:

$(document).ready(function(){
     $("#kat").change(function(){ 
         alert("Hello");
     });
});

答案 7 :(得分:0)

这对我有用。可能是上面提到的浏览器问题,或者jQuery没有正确注册,或者真正的问题可能更复杂(你做了一个更简单的版本来问这个)。 PS - 确实必须单击文本框以使其触发。

http://jsfiddle.net/toddhd/Qt7fH/

答案 8 :(得分:0)

这适用于所有浏览器和Jquery&lt; = v1.10

$('#kat').on('keyup', function () {
    alert("Hello");
});

或者看起来像你想要的

$('#kat').on('click', function () {
    alert("Hello");
});

文本框输入字段更改事件会像您期望的那样触发,jQuery .Change事件仅在支持html5的浏览器上正常工作

答案 9 :(得分:0)

试试这个,

$('#kat').on('input',function(e){
 alert('Hello')
});