Jquery动态更新select中的"other"选项

Question

我正在开发一个项目,它将使用大量选择菜单输入各种数据.我想直接在select中包含一个'other'选项,它将触发一个简单的对话框,并允许用户输入一个自定义值(如果适用),类似于以下javascript代码:

<script type="text/javascript" language="javascript">
    function chkother(fld,len,idx) {
        if ((idx+1)==len) {
            other=prompt("Please indicate 'other' value:");
            fld.options[idx].value=other;
            fld.options[idx].text=other;
        }
    }
</script> 

适用于选择:

<select onchange="chkother(this,this.options.length,this.options.selectedIndex)" name="example" id="example" class="formSelect">
<option  value=""></option>
<option  value="yes">yes</option>
<option  value="no">no</option>
<option  value="other">other</option>
</select>

并显示一个提示,它将使用用户文本更新选项.

我想使用jquery做类似的事情,所以我可以看看扩展功能和学习一些jquery,但是我开始时遇到了麻烦.

Answer 1

这将帮助您入门.这将为页面上的任何选择添加功能,将新值附加到选择(并在发生错误时保留其他值).

$(function() {
    $('select').change( function() {
        var value = $(this).val();
        if (!value || value == '') {
           var other = prompt( "Please indicate other value:" );
           if (!other) return false;
           $(this).append('<option value="'
                             + other
                             + '" selected="selected">'
                             + other
                             + '</option>');
        }
    });
});