1

下面的函数,将动态添加一个新的选项值到一个选择框中。很棒的功能,但在将新选项添加​​到选择框中之前,它不会考虑和检查重复条目。如何修改代码以提醒用户发现重复条目​​并中止添加相同的选项值:

function addref() {

var value = document.getElementById('refdocs').value

    if (value != "") {

        var select = document.getElementById('refdocs_list');

        var option = document.createElement('option');

        option.text = value

        select.add(option,select.option)

        select.selectedIndex = select.options.length - 1;
    }//end of if

}//end of function
4

1 回答 1

1

演示:http: //jsfiddle.net/abc123/rcwgk/2/

这将起作用,这会增加您可能想要以不同方式做某事的值和选项。

    <html>
    <head>
        <script type="text/javascript">
            var values = new Array();
            var options = new Array();

            if(!Array.prototype.indexOf) {
                Array.prototype.indexOf = function(needle) {
                    for(var i = 0; i < this.length; i++) {
                        if(this[i] === needle) {
                            return i;
                        }
                    }
                    return -1;
                };
            }

            function getOptions() {
                var selectobject=document.getElementById("refdocs_list");
                for (var i=0; i<selectobject.length; i++){
                    values.push(selectobject.options[i].value);
                    options.push(selectobject.options[i].text);
                }
            }

            function addref() {

                var value = document.getElementById('refdocs').value

                if (value != "" && values.indexOf(value) == -1 && options.indexOf(value) == -1 ) {
                    values.push(value);
                    options.push(value);
                    var select = document.getElementById('refdocs_list');

                    var option = document.createElement('option');

                    option.text = value

                    select.add(option,select.option)

                    select.selectedIndex = select.options.length - 1;
                }//end of if

            }//end of function
        </script>
    </head>
            <body onload="getOptions()">
<select id="refdocs_list">
     <option value="1">test</option>
</select>

<input type="text" id="refdocs"/>
<input type="button" value="add" onclick="javascript:addref()" />
            </body>
        </html>
于 2013-01-28T22:08:34.567 回答