通过多项选择，我们如何知道用户选择或取消选择了某个值？答案

【问题标题】：With multiple select how can we know that user selected or un-selected some value?通过多项选择，我们如何知道用户选择或取消选择了某个值？
【发布时间】：2012-04-16 20:18:02
【问题描述】：

考虑简单的多选框

<select name="waste" id="waste" multiple>
<option value="5">garbage</option>
<option value="6">food</option>
<option value="8">Tin</option>
<option value="9">Can</option>
</select>

它所做的只是改变事件

$('#waste').change(function(){
//Inside here how will I know that this event was fired when user removed some values from selection 
// or did he added more values in selection
});

【问题讨论】：

stackoverflow.com/questions/1159046/… ;这可能会有所帮助。干杯！

标签： jquery select

【解决方案1】：

试试这个：

$('#waste').change(function(){
    var selected=$(this).val();
    // selected now contains an array of the selected values
});

演示：http://jsfiddle.net/pUcRe/

【讨论】：

【解决方案2】：

试试这个例子：http://jsfiddle.net/7rf9J/

(function() {
    var s = $('#waste'),
      var  i = s.val().length;

    s.change(function(){
        var l = $(this).val().length;
        if (l === i) {
            console.log('you\'ve not changed selected value/s');   
        }
        else {
            if (l > i) {
                console.log('you inserted value/s');  
            }
            else {
                console.log('you removed value/s');             
            }
        }
        i = l;
    });
}());

我已将您的函数包含在一个立即自执行函数中，在该函数中我声明了一个包含所选项目数量的变量。每次添加或删除项目时，我都会保存值的当前长度（最初设置为 0），这样您就知道您是否添加、删除或更改了选择。

【讨论】：

【解决方案3】：

我写了一个可以完全满足你需要的例子。示例在这里：http://jsfiddle.net/hesher/3M36e/5/

代码：

var prevarray = [];

$("select").change(function(event) {
    var
    thisarray = $(event.currentTarget).children(":selected").map(function(index, item) {
        return $(item).text()
    });



    for (i = 0; i < thisarray.length; i++) {
        var anoption = thisarray[i];
        if ($.inArray(anoption, prevarray) === -1) {

            console.log("added " + anoption);
        }
    }

    for (i = 0; i < prevarray.length; i++) {
        var anoption = prevarray[i];;
        if ($.inArray(anoption, thisarray) === -1) {
            console.log("removed " + anoption);
        }
    }

    prevarray = thisarray;

});

【讨论】：

【解决方案4】：

试试这个：

<select name="waste" id="waste" multiple>
    <option value="5">garbage</option>
    <option value="6">food</option>
    <option value="8">Tin</option>
    <option value="9">Can</option>
</select>
<p></p>

而js是：

function displayVals() {
     var wasteValues = $("#waste").val() || [];
     $("p").html("<b>Values:</b> " + multipleValues.join(", "));
   }
   $("#waste").change(displayVals);
   displayVals();

或者看看这个：http://api.jquery.com/val/希望这对你有帮助：]

【讨论】：