检测输入文本何时更改

Detect when input text change

本文关键字:何时更 文本 输入 检测      更新时间:2023-09-26

我正在尝试为一个输入和一个类似ul-li的选择选项设置样式(如下所示)。如果我点击一个li,我成功地更改了输入文本的值。例如,如果我点击第一个li,#main值将为1,或者在第二个li上为2。

<div>
    <input id="main" type="text" disabled placeholder="Select...">
    <ul id="main-list>
        <li>1</li>       
        <li>2</li>
    </ul>
 </div>

现在,我正在尝试检测#main inputonchange的值,以便将#sub-list的内容相应地更改为#main的值。

<script>
 var mymap = {"1": ["a1", "b1", "c1"]
             ,"2": ["a2", "b2", "c2"]
            };
</script>
 <div>
    <input id="sub" type="text" disabled placeholder="Select...">
    <ul id="sub-list">
        <li>1</li>
        <li>2</li>
    </ul>
 </div>
 <script>
 $("#main).bind("change", function() {
     // Reset the #sub-list
     alert($(this).val());
 });
</script>

我遇到的问题是,即使#main值发生了更改,我也无法检测#main onchange的值来重置#sub列表的内容。有人能帮忙解释一下问题是什么吗?

在onlick 中添加您的逻辑

    $("#main-list li").bind("click", function() {
    $("#main").val($(this).html());
    $("#main").css('background-color','#FC0');
    $(this).parent().append('value changed');

});

http://jsfiddle.net/dshun/ud4r1p84/