使用jquery\'this\'从下拉列表中返回选择的选项，但它返回页面上的所有下拉列表

问题描述

|| 我的页面上有几乎相同的选择框列表。我希望函数仅在已更改的框中返回所选的值；现在，它将返回页面上所有框的选定值。我认为我在某种程度上滥用了“这”，但无法弄清楚如何。

<ul class=\"edgetoedge\" id=\"finisherlist\">
<form method=\"post\">
<li class=\"entry\">
<span class=\"finishingposition\">1</span>
<span class=\"runnerblock\">
<select placeholder=\"Finisher name\" name=\"finisher\" 
    class=\"finisherchoice\" onChange=\"saveFinishOrder();\">
<option value=\"0\" selected=\"selected\" data-skip=\"1\">Select runner</option>
<option value=\"1\">Bob</option>
<option value=\"2\">Peter</option>
</select></span>
</li>
<li class=\"entry\">
<span class=\"finishingposition\">2</span>
<span class=\"runnerblock\">
<select placeholder=\"Finisher name\" name=\"finisher\" class=\"finisherchoice\"     
    onChange=\"saveFinishOrder();\">
<option value=\"0\" selected=\"selected\" data-skip=\"1\">Select runner</option>
<option value=\"1\">Bob</option>
<option value=\"2\">Peter</option>
</select></span>
</li>
</form>
</ul>

我的单独JavaScript如下所示：

function saveFinishOrder() {
alert($(this +\'option:selected\').text());
}

当我更改下拉菜单之一时，会收到类似“ PeterSelectRunner \”的警报-即，它会向我返回页面上所有下拉菜单的当前选定值。我想要的只是获取该下拉菜单的值，以便可以将其保存到表中。 在上面的示例代码中，EDIT删除了放错位置的标签。     

解决方法

onChange=\"saveFinishOrder(this);\"

和

function saveFinishOrder(elem) {
    alert($(elem).val());
}

    ,尝试这个：

function saveFinishOrder() {
  alert($(this).find(\'option:selected\').text());
}

此外，检查您的HTML，您是否有重复的结束标记，并且在选项列表末尾之前。