根据类将下拉列表更改为匹配单击链接

Question

当我单击一个链接时，我希望下拉列表与我单击的链接相匹配。我可以用hasClass写一个if-语句，但我想把它写得简短些.链接可以包含多个类-我只想匹配apple-x类。这就是我得到的：

HTML

<a href="#" class="apple-1 fruit">Apple 1</a>
<a href="#" class="fruit apple-2 tasty">Apple 2</a>
<a href="#" class="apple-3 fruit no-so-tasty">Apple 3</a>
<select id="fruits">
<option value="apple-1 fruit">Apple 1</option>
<option value="apple-2 fruit">Apple 2</option>
<option value="apple-3 fruit">Apple 3</option>
</select>

jQuery

$('a.fruit').click(function () {
  var selected = "what goes here?";
  $('#fruits option[value*="'+selected+'"]').attr('selected','selected');
  return false;
});

Answer 1

试一试

$('a.fruit').click(function (e) {
    e.preventDefault();

    var selected = this.className.match(/apple-[^\s$]+/)[0];
    $('#fruits option[value*="' + selected + '"]').prop('selected', true);
});

演示：小提琴