确保使用所有值

时间:2014-03-12 15:30:40

标签: jquery

我正在努力确保除了一个之外的所有值都用在我的下拉中 - 但是有一个错误,它可能会欺骗它。我不确定为什么。

您可以尝试: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 个答案:

答案 0 :(得分:0)

技巧问题,小提琴中的代码与发布的代码不匹配。小提琴适用于发布的代码

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函数只返回数字,所以完全意义上唯一不起作用< / p>

答案 1 :(得分:0)

试试这个: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 :)');
  }

});