代码之家 › 专栏 › 技术社区 › janhartmann

确保使用所有值

jquery

janhartmann · 技术社区 · 11 年前

我正在努力确保下拉列表中使用了除一个值以外的所有值,但有一个错误,可能会欺骗它。我不知道为什么。

您可以试穿: http://jsfiddle.net/BSxXk/2/ 并使用以下值: 4 2 3 4 -这将产生一个错误,因为 1 未使用。我正在Windows上使用Firefox。

HTML格式:

<select name="answer" class="question-answer">
    <option value="-1">Choose value</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

<select name="answer" class="question-answer">
    <option value="-1">Choose value</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

<select name="answer" class="question-answer">
    <option value="-1">Choose value</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

<select name="answer" class="question-answer">
    <option value="-1">Choose value</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

<div id="result">d</div>

<button id="submit">Test</button>

JQuery:

var valid_values = [1, 2, 3, 4];

$("#submit").on("click", function(event) {
    event.preventDefault();
    var values = $.unique($('select.question-answer').map(function() {
        var value = $(this).val();
        if (value === "-1") {
            return;
        }
        return value;
    }));
    if(values.length === valid_values.length) {
       $("#result").html("Valid");
    } else {
        $("#result").html("All values (1-4) should be used in answering the question.");
    }
});

错误屏幕截图。1未使用,但表示有效:

enter image description here

请注意,这是我上一个问题的后续内容: Make sure all values are used in drop downs

2 回复 | 直到 7 年前

Huangism 11 年前

技巧问题,小提琴中的代码与发布的代码不匹配。小提琴与张贴的代码配合良好

http://jsfiddle.net/BSxXk/2/

var valid_values = [1, 2, 3, 4];

$("#submit").on("click", function(event) {
    event.preventDefault();
    var values = $.unique($('select.question-answer').map(function() {
        var value = $(this).val();
        if (value === "-1") {
            return;
        }
        return value;
    }));
    if(values.length === valid_values.length) {
       $("#result").html("Valid");
    } else {
        $("#result").html("All values (1-4) should be used in answering the question.");
    }
});

更新

使用jquery 1.10.1对我很有用 http://jsfiddle.net/BSxXk/5/ 使用上面的任何东西,对我都不起作用

我仍然认为这里使用unique是不正确的,因为$.unique只适用于DOM元素 https://api.jquery.com/jQuery.unique/ 问题答案上的map函数只返回数字,因此唯一性不起作用是完全合理的

Aamir Afridi 11 年前

试试看: http://jsbin.com/ciwaq/1/edit

$('button').click(function(){

  var values = ['1','2','3','4'];
  var selectValues = [];

  $('select').each(function(){
    selectValues.push($(this).val());
  });

  if($(values).not($(values).not(selectValues).get()).get().length !== values.length) {
     $('#result').html('All values are not used');
  }
  else {
    $('#result').html('All values ARE USED :)');
  }

});