如何选择html <option> where text = Washington </option>

Question

如何选择text = Washington的html 我这样做是为了

var opt = $("#address_states_state option[text='Washington']");
var html = $("<div>").append(opt.clone()).html();
html = html.replace(/\>/, ' selected="selected">');
opt.replaceWith(html);

Answer 1

没有直接选择器来获取其text等于X的元素。但是你可以做几件事：

您可以使用filter()：

$('#address_states_state option').filter(function(i, el) {
   return $(el).text() === 'Washington'
});

或者，编写自己的伪选择器：

jQuery.expr[':'].textEquals = $.expr.createPseudo(function( text ) {
    return function(elem) {
        return $(elem).text() === text;
    }
});

然后你就做了：

$('#address_states_state option:textEquals("Washington")')

Here's an example of the latter

Answer 2

您可以使用:contains()选择器执行此操作：

$("#address_states_state option:contains('Washington')").prop('selected', true);

而不是执行克隆，然后将其替换为选定的选项。

演示：Fiddle

<强>更新

如果要选择具有特定文本的选项（在您的情况下为，'Washington'），您可以执行以下操作：

$('#address_states_state option').filter(function () {
    return $(this).text().toLowerCase() === 'washington';
}).prop('selected', true);

演示：Fiddle