解决方法jquery在没有匹配值时在SELECT上设置val()行为

时间:2013-06-14 17:58:22

标签: javascript jquery select

如果我有这个选择框:

<select id="s" name="s">
<option value="0">-</option>
<option value="1">A</option>
<option value="2" selected>B</option>
<option value="3">C</option>
</select>

如果我尝试运行$("#s").val("4"),则选择更改为“0”。 (请参阅此处的行为:http://jsfiddle.net/4NwN5/)如何尝试将选择框设置为选择框中不存在的值,以便没有任何更改?

3 个答案:

答案 0 :(得分:7)

您可以尝试这种方式:

var toSel = 3; // Say your value is this
if($("#s option[value=" + toSel +"]").length > 0) //Check if an option exist with that value
{
    $("#s").val(toSel); //Select the value
}

或只需使用prop()

$("#s option[value='" + toSel +"']").prop('selected', true);

Demo

答案 1 :(得分:1)

// grab the selected
var s = $("#s");

// cache the current selectedIndex
var idx = s[0].selectedIndex;

// set the value
s.val("4");

// If it was set to `0`, set it back to the original index
s[0].selectedIndex = s[0].selectedIndex || idx;

你可以把它变成插件:

jQuery.fn.selectVal = function (val) {
    return this.each(function () {
        if (this.nodeName === "SELECT") {
            var idx = this.selectedIndex;

            $(this).val(val);

            var newOpt = this.options[this.selectedIndex];

            if (newOpt.value !== ("" + val))
                this.selectedIndex = idx;
        }
    })
};

$("#s").selectVal(4);

答案 2 :(得分:0)

jsFiddle Demo

在调用jquery的val

之前,您可能希望使用自定义过滤器
$.fn.valScreen = function(value){
 if( this.is("select") && this.find("option[value="+value+"]").length != 0 )
  this.val(value);//call vanilla val
 return this;//return jQuery object for chaining
};

然后你可以使用它:

$("#s").valScreen("4");