如何在javascript中动态地向文本框添加多个值时避免重复值?

时间:2011-11-05 11:01:57

标签: javascript html

我正在尝试向隐藏字段添加多个值。 它工作正常,但我希望隐藏字段中添加的值是唯一的,如果输入的值不止一次,则不会添加。

interestin 是选择值的选择框的名称, interest 是隐藏字段的ID,其中值以逗号分隔值的形式添加,同时选择选项在选择框中。

如果选择了两次相同的选项,则会在隐藏字段中添加两次。我不想在隐藏字段中添加任何值,尽管它被选中两次。

在选择框中选择值时会调用函数点击器(name =“interestin”),并且值将添加到隐藏字段中(id =“interest”)

function clicker(){
            var itemsobj=document.getElementsByName("interestedin[]");
            str='';
            //alert(itemsobj[0].value);
            //alert('test');
            count=0;
            var arr = new Array();
    for(var i=0;i<itemsobj.length;i++)
        {
            count += 1;
            str +=itemsobj[i].value+',';
            //alert(str);
            arr[i] = itemsobj[i].value; 
                }
            var length=str.length;
            var strr=str.substring(0,length-1);
            document.getElementById('interest').value = strr;
            //alert(strr);


            setProductPrice(arr,count);
        }

1 个答案:

答案 0 :(得分:1)

Hiya sup man希望这有帮助,因为我刚刚解决了一些演示 http://jsfiddle.net/Yvnfx/  没有提醒http://jsfiddle.net/Yvnfx/1/

对于案例 - 如果您删除了所选的自动填充 http://jsfiddle.net/wbQZU/4/

Autocomplete (like facebook) has give up a duplicate value

想法是创建NewArray = AvailableTagsArray - UsedItemArray

这将有所帮助,并希望演示更清晰,!乙 - )

Jquery代码以避免重复数组

**var usedItems = []**
:
:// then
source: function(request, response) {

      //build new array with = AvailableTagsArray - UsedItemArray
             var newNonDuplicatetag = $.grep(availableTags, function(el){return $.inArray(el, usedItems) == -1});

            // delegate back to autocomplete, but extract the last term
            response($.ui.autocomplete.filter(
            newNonDuplicatetag, extractLast(request.term)));
        },

我的演示中的完整Jquery

$(function() {
    var usedItems = [];

    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
        ];

    function split(val) {
        return val.split(/,\s*/);
    }

    function extractLast(term) {
        return split(term).pop();
    }


    $("#tags")
    // don't navigate away from the field on tab when selecting an item
    .bind("keydown", function(event) {
        if (event.keyCode === $.ui.keyCode.TAB && $(this).data("autocomplete").menu.active) {
            event.preventDefault();
        }
    }).autocomplete({
        minLength: 0,
        source: function(request, response) {
             var newNonDuplicatetag = $.grep(availableTags, function(el){return $.inArray(el, usedItems) == -1}); 
            // delegate back to autocomplete, but extract the last term
            response($.ui.autocomplete.filter(
            newNonDuplicatetag, extractLast(request.term)));
        },
        focus: function() {
            // prevent value inserted on focus
            return false;
        },
        select: function(event, ui) {
            var terms = split(this.value);
            // remove the current input
            terms.pop();
            // add the selected item
            usedItems.push(ui.item.value);
            alert(usedItems[1]);
            terms.push(ui.item.value);
            // add placeholder to get the comma-and-space at the end
            terms.push("");
            this.value = terms.join(", ");
            return false;
        }
    });
});


​