JQuery 从选项中按文本选择

Question

我有以下html：

<select class="select optional form-control" id="search_form_handover_location" name="search_form[handover_location]"><option value="">Wybierz miejsce odbioru</
    <option value="Gdańsk">Gdańsk</option>
    <option value="Gdańsk">Gdańsk, Lotnisko</option>
    <option value="Ożarowice">Katowice, Lotnisko</option>
</select>    
<select class="select optional form-control" id="search_form_return_location" name="search_form[return_location]"><option value="">Wybierz miejsce zwrotu</option>
      <option value="Gdańsk">Gdańsk</option>
      <option value="Gdańsk">Gdańsk, Lotnisko</option>
      <option value="Ożarowice">Katowice, Lotnisko</option>
</select>

在我的应用程序中，我使用 JQuery 来自动完成第二次选择。因此，当您在第一次选择中选择“格但斯克”时，它也会在第二次选择中选择它。我的咖啡脚本代码如下所示：

$ ->
  $('#search_form_handover_location').change ->
    location = $("option:selected", this).val()
    $('#search_form_return_location').val(location)

现在我通过使用每个选项的值来做这件事。但现在我想通过使用不是值而是文本来做到这一点。因此，当您在第一次选择中选择“Gdańsk, Lotnisko”时，它将在第二次选择选项中自动选择相同的文本。有没有办法解决我的问题？

Answer 1

您可以使用此行获取文本，随心所欲地使用它...

$("#search_form_handover_location:selected").text();

Answer 2

试试这个：在第一个下拉列表中获取文本表单，然后在第二个下拉列表中找到它。

$ ->
  $('#search_form_handover_location').change ->
     locationTxt = $("option:selected", this).text();

        $('#search_form_return_location option').each(function(){
           if($(this).text()==locationTxt)
               $(this).prop('selected',true);
           else
               $(this).removeProp('selected'); 
       });

Answer 3

var location=$("#search_form_handover_location:selected").text();

$("#search_form_return_location option").filter(function() {
    //may want to use $.trim in here
    return $(this).text() == location; 
}).attr('selected', true);