具有 select2 功能的 attr

Question

我已经使用 select2 进行搜索。我使用了以下代码

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<select class="form-control select2" id="by_content">
  <option value="Select Medicine">Select Medicine</option>
  <option value="Abc">Abc</option>
</select>
<button id="click">Search</button>
<script>
  $('.select2').select2();
</script>
<script>
  $("#click").click(function() {
    $('select option[value="Select Medicine"]').attr("selected", true);
  });
</script>

我检查了 inspect 元素属性 selected 已添加，但 select 药物未显示。当我在没有 select2 选项的情况下使用时，它是有效的。但是对于搜索选项，我应该使用 select2 函数。请为此建议我。

Answer 1

您可以使用以下内容

您可以简单地将值设置为 select2，然后调用触发更改事件以告知 select2 选项选择已更改，它将更新 UI。

<script>
  $("#click").click(function() {
    $('select').val("Select Medicine").trigger('change');
  });
</script>

Answer 2

实际上您的代码运行良好。但是您想触发 select2 的更改选择。所以你可以通过这种方式实现它。

$('select').val('Select Medicine').trigger('change');

已更新

您应该像这样将内联 jquery 移动到正确的位置

<body>  
    <div>  
        <p> </p>  
    </div>  
</body>
@Scripts.Render("~/bundles/jquery")
<scripts type="text/javascript">
  $('.select2').select2();
  $("#click").click(function(){
          $('select option[value="Select Medicine"]').attr("selected",true);
          console.log($('select option[value="Select Medicine"]').attr("selected"));

          // Trigger selected value here
          $('select').val('Select Medicine').trigger('change');
      });
</scripts>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> 

<select class="form-control select2" id="by_content">  
   <option value="Select Medicine">Select Medicine</option> 
   <option value="Abc">Abc</option> 
   <option value="Def">Def</option>
</select> 
<button id="click">Search</button>
<script> $('.select2').select2(); </script>
<script>
  $("#click").click(function(){
      $('select option[value="Select Medicine"]').attr("selected",true);
      console.log($('select option[value="Select Medicine"]').attr("selected"));
      
      // Trigger selected value here
      $('select').val('Select Medicine').trigger('change');
  });
</script>

具有 select2 功能的 attr

attr with select2 function

jquery

jquery-select2