如果 select 选项与 span 标签中的内容匹配,我该如何设置 jquery 选项?

How do I set a select option with jquery if it matches the content in a span tag?

我有一个包含艺术家列表的下拉 select/option 元素:

<select id="taxonomy_dropdown_widget_dropdown_2"  onchange="document.location.href=this.options[this.selectedIndex].value;"  class="taxonomy_dropdown_widget_dropdown" name="taxonomy_dropdown_widget_dropdown_2">
<option value="">Browse Artists</option>
<option value="http://dev/artist-tag/a-aublet/">A. Aublet (1)</option>
<option value="http://dev/artist-tag/a-carie-baron/">A. Carie Baron (1)</option>
</select>

如果您单击该艺术家的其中一幅图像,您将导航到一个页面。位于该页面上的是 html:

<span class="tagged_as"><span>Artist:</span> <a rel="tag" href="http://dev/artist-tag/a-aublet/">A. Aublet</a></span>

标签中的名称几乎与选项 select 中的名称匹配,但没有 (1)。

我想用jquery检查页面上的名称(.tagged_as a)和select匹配它的选项。

我想做的大概是这样(但行不通):

var artistName = document.querySelector("span.tagged_as > a");

if ( artistName ) { 

var artistNamevalue = artistName.innerHTML ; 

$('#taxonomy_dropdown_widget_dropdown_2 option').filter(function() {

return this.text == artistNamevalue; 

}).attr('selected', true);

}

这是我正在尝试的 fiddle:https://jsfiddle.net/1w4qx4ne/

'Browse Artists' 下拉菜单应该显示:A. Aublet

由于您没有完美匹配艺术家姓名(您只需要检查文本是否包含艺术家姓名的子字符串),一种解决方案是使用 text.indexOf()。这是代码:

$('#taxonomy_dropdown_widget_dropdown_2 option').filter(function() {
  return (this.text.indexOf(artistNamevalue) >= 0); 
}).attr('selected', 'selected');

Fiddle https://jsfiddle.net/1w4qx4ne/1/