Jquery 选择带有文本的选项无法正常工作

Question

我正在尝试使用 JQuery 选择具有特定文本的选项，但我不确定如何过滤掉我正在查找的文本。

我正在尝试选择“大”选项，而不是“XLarge”选项。关于我如何实现这一目标有什么想法吗？

这是 HTML：

<span class="price">
 $20
</span>
<p id="in-carHEREt" style="display: none;">in cartHERE</p>
 <span class="needsclick select-widget  enabled" id="size-options-link">Medium</span>
 <select id="size-options" name="size-options" class="select-widget ">
<option value="46158">Medium</option>    
<option value="46159">Large</option>    
 <option value="46160">XLarge</option>    
</select>

 <span id="cart-update"><span class="cart-button">add to cart</span></span>

这是 JQuery：

$('#size-options').find('option:contains(Large)').prop('selected', true);

此代码最终选择 XLarge 尺寸而不是首选的 Large 尺寸。这是我的 JSFiddle：https ://jsfiddle.net/MGames/8o4u36a6/1/

注意：不要将其标记为重复，因为我在与此类似的问题上尝试过的几乎所有代码都不适用于我的问题。谢谢你和我爱你很久了:)

Answer 1

如下所示：-

$('#size-options option').each(function(){
  if($(this).text() =='Large'){
     $(this).prop('selected', true);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="price">
 $20
</span>
<p id="in-carHEREt" style="display: none;">in cartHERE</p>
 <span class="needsclick select-widget  enabled" id="size-options-link">Medium</span>
 <select id="size-options" name="size-options" class="select-widget ">
<option value="46158">Medium</option>    
<option value="46159">Large</option>    
 <option value="46160">XLarge</option>    
</select>

 <span id="cart-update"><span class="cart-button">add to cart</span></span>