Question

我正在尝试设置输入样式和ul-li like select-option（如下面的样式）。如果我点击li，我会成功更改输入文本的值。例如，如果我点击第二个li上的第一个li或2，则#main值将为1.

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

现在，我正在尝试检测#main输入onchange的值，以便我可以相应地将#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-list的内容。任何人都可以帮助解释这个问题吗？

Answer 1

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

检测输入文本何时更改

1 个答案: