Question

我有一个带有4个输入的表单（甚至可以更多），用户可以输入数字或不输入任何内容。唯一的规则是，如果您在输入中输入数字，如果相同的数字在另一个输入中，则无法提交（无重复）。您可以根据需要提交尽可能多的空输入。

为了验证输入，我将所有输入的数组长度与具有唯一值的相同数组进行比较。如果它们的长度相同则没问题。我需要改进我的代码，因为现在它仅在用户输入所有输入字段时才有效。如果某些输入为空，则它们在数组中被视为具有唯一值，因为它们都具有“”作为值。因此，如果用户只输入一个数字，我将得到数组长度为4，数组唯一为2，但它应为1和1（跳过空白项目）。

我在考虑在splice()上使用arr，但这是进行此验证的最佳方法吗？ **编辑：我应用了拼接但如果数组是（'1'，''，''）我的代码给了我（'1'，''）而不仅仅是（1），正如我所期待的那样...... * *这是因为splice删除了项目并更改了数组长度，因此for循环指向错误的索引。任何的想法？ HTML：

<div class="sez-form">
    <fieldset>
        <legend>Messaggi inclusi</legend>
        <div class="percheckbox">
            <input class="checkseq" type="checkbox" value="1" name="messaggio[0]">
            Prova di messaggio che scorre<br>
            <label>Ordine: </label>
            <input class="seq" type="text" name="ordine[0]" maxlength="2" size="2">
        </div>

        <div class="percheckbox">
            <input class="checkseq" type="checkbox" value="3" name="messaggio[1]">
            Titoli di film<br>
            <label>Ordine: </label>
            <input class="seq" type="text" name="ordine[1]" maxlength="2" size="2">
        </div>

        <div class="percheckbox">
            <input class="checkseq" type="checkbox" value="6" name="messaggio[2]">
            Prova a testo fisso<br>
            <label>Ordine: </label>
            <input class="seq" type="text" name="ordine[2]" maxlength="2" size="2">
        </div>
        <br style="clear: both;">
    </fieldset>
</div>

JAVASCRIPT：

function uniqueArray(arr) {
    return $.grep(arr,function(v,k) {
        return $.inArray(v,arr) === k;
    });
}

$(document).ready(function() {
    $('#invia').click(function(e) {
        e.preventDefault();
        var arr = $(".seq").map(function(){ return $(this).val(); }).toArray();
        var empty = $(".seq").filter(function() {
            return this.value == "";
        })
    for (index = 0; index < arr.length; ++index) {
        if (arr[index]=='') {
            new_arr = arr.splice([index],1);
        }
        console.log(arr);
    }

        if(empty.length == $('.seq').length) {
            alert('Non hai scelto alcun messaggio per il workflow. Correggi per procedere.');
        }
        else if(uniqueArray(arr).length != $('.seq').length) {
            console.log(uniqueArray(arr));
            alert('Ci sono voci duplicate nella sequenza. Correggi per procedere.');
        }
        else if($('#dt_from').val()=='__/__/____ __:__') {
            alert('Scegli data e ora di inizio validit\u00E0 per il workflow');
        }
        else if($('#dt_to').val()=='__/__/____ __:__') {
            alert('Scegli data e ora di fine validit\u00E0 per il workflow');
        }
        else {
            ajaxSubmit();
        }
    });
});

Answer 1

也许我不明白你想要做什么，但为什么你不能简单地用以下的方式做到：

$('#invia').click(function(e) {
    e.preventDefault();
    var unique = [], nonunique = [];
    $(".seq").each(function(index){
        var val = $(this).val();
        if (val !== "") {
            if ($.inArray(val, unique) !== -1) {
                nonunique.push(val);
            } else {
                unique.push(val);
            }
        }
    });
    // If unique and nonunique are empty, all inputs were blank
    // else if nonunique is empty, inputs are valid and in unique
});

Answer 2

这是另一种处理它的方法。 Here is the working JSFiddle.以下是代码：

$(function() {
    $("#submit").click(function() {
        //build a profile of the inputs
        var inputs = [];
        var values = [];
        var dups = false; //track duplicates on pass 1

        $(".seq").each(function(i, el) {
            var empty = (el.value == ""); //check if empty
            var exists = (!empty && $.grep(inputs, function(item, index) {
                return (item.Value === el.value);
            }).length > 0); //check if exists
            dups = (dups || exists); //track dups

            //add the new input item
            var obj = {
                Element: el,
                Value: el.value,
                Empty: empty,
                Exists: exists
            };
            inputs.push(obj);

            //conditionally add the sorting value
            if (!empty && !exists)
                values.push(el.value);
        });

        //Validate the inputs. If there are duplicates, don't submit
        $(".seq").css("background-color", "white"); //clear errors
        if (dups) {
            $(inputs).each(function(i, el) {
                if (el.Exists) 
                    el.Element.style.backgroundColor = "red";
            });
        } else {
            values = values.sort();
            alert(values);
        }
    });
});

使用此方法，最后您有一个数组 - inputs - 包含其状态的所有元素，以便您可以在特定字段上提供错误处理。在我的示例中，错误字段变为红色。

在alert处，您有一个有效值的排序数组。

Answer 3

在迭代时使用哈希来跟踪值。此示例只返回true或false，但您也可以扫描整个数组并返回重复的值。

function uniquifyArray(ary) { 
    var seen = {};
    var isUnique = true;
    /* iterate backwards since the array length will change as elements are removed */
    for (var i=ary.length; i--;) {
        /* remove blank/undefined */
        if (typeof ary[i] === 'undefined' || ary[i] === '') {                
            ary.splice(i,1);
        } else {   
            /* check if this value has already been seen */
            if (ary[i] in seen) { 
                isUnique = false;
                ary.splice(i,1);
            } else { 
                seen[ary[i]]=true;   
            }
        }
    }
    ary = ary.sort();
    return isUnique;
}

var test = [ '1','2','','','3','4','1' ];
uniquifyArray(test); // returns false, test = [ '1','2','3','4' ]

test = [ '1','2','','' ]
uniquifyArray(test); //true, test = ['1','2']

比较基于长度的两个数组：跳过空值

3 个答案: