Question

我使用J-Query，我在获取选项值方面遇到了问题。我想获得具有特定文本的选项（文本不区分大小写）。我使用了以下代码 -

我的Html代码是 -

<select id="ddlStateList_CA">
            <option value="AB">Alberta</option>
            <option value="BC">British Columbia</option>
            <option value="MB">Manitoba</option>
            <option value="NB">New Brunswick</option>
            <option value="NL">Newfoundland and Labrador</option>
            <option value="NT">Northwest Territories</option>
            <option value="NS">Nova Scotia</option>
            <option value="NU">Nunavut</option>
            <option value="ON">Ontario</option>
            <option value="PE">Prince Edward Island</option>
            <option value="QC">Quebec</option>
            <option value="SK">Saskatchewan</option>
            <option value="YT">Yukon</option>
        </select>

Jquery代码 -

$('#ddlStateList_CA option:contains("Manitoba")').val();

运行此代码时，我得到正确的结果。但是当按照Jquery代码运行时，我得到了undefined。

$('#ddlStateList_CA option:contains("manitoba")').val();

我知道Manitoba和manitoba不一样，但如果我想为这两种情况做这项工作我怎样才能做到这一点？

Example

Answer 1

使用过滤器

$('#button').click(function() {
    console.log($("select option").filter(function() {
        return $(this).text().toLowerCase() === 'manitoBa'.toLowerCase();
    }).text());
});

<强> JSFiddle

Answer 2

使用简单的基于正则表达式的过滤器

var regexp = new RegExp('manitoba', 'i');

var val = $('#ddlStateList_CA option').filter(function(){
    return regexp.test($(this).text())
}).val();

演示：Fiddle

Answer 3

我的文件中有一个可以做你想要的功能。加载jQuery后添加：

if(jQuery){
    (function($){
        //@Author Karl-André Gagnon
        if(!$.fn.filterText) $.fn.filterText = function(text, caseSensitive){
            var returnedObj = $(),
                caseSensitive = caseSensitive || false,
                $this = $(this);
            if(text instanceof Array){
                for(var i = 0; i < text.length; i++){
                    if(typeof text[i] == 'string'){
                        returnedObj = returnedObj.add($this.filter(function(){
                            var search = caseSensitive ? text[i] : new RegExp(text[i], 'i')
                            return $(this).text().search(search) != -1;
                        }))
                    }else if(text[i] instanceof RegExp){
                        returnedObj = returnedObj.add($this.filter(function(){
                            return $(this).text().search(text[i]) != -1;
                        }))
                    }
                }
            }else if(typeof text == 'string'){
                returnedObj = returnedObj.add($this.filter(function(){
                    var search = caseSensitive ? text : new RegExp(text, 'i')
                    return $(this).text().search(search) != -1;
                }))
            }else if(text instanceof RegExp){
                returnedObj = returnedObj.add($this.filter(function(){
                    return $(this).text().search(text) != -1;
                }))
            }
            return returnedObj;
        }
    })(jQuery)
}

缩小版本： http://pastebin.com/hiJ4aw8x

然后，您有多种选择。你可以这样称呼它：

alert($('#ddlStateList_CA option').filterText('manitoba', false).val())

false表示“caseSensitive”（默认值为false，因此实际上不需要）。

或者用regexp调用它：

alert($('#ddlStateList_CA option').filterText(/manitoba/i).val());

小提琴：http://jsfiddle.net/Cv8uC/6/

如何通过特定文本获取下拉列表项（不区分大小写）

3 个答案: