以编程方式选择一个选项 - Materialise css

Question

如何以编程方式从Materialize css中选择一个选项？ 我尝试用第一个选项附加select的值。

非常感谢任何帮助。

感谢。

＆＃13;

＆＃13;

$('select').material_select();
$('#select_1').val($('#select_1 option:first').val());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">


<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>

<div class="row">
  <div class="input-field col s12">
    <select id="select_1" name="select_1">
      <option disabled selected>Choose your option</option>
      <option>Option 1</option>
      <option>Option 2</option>
      <option>Option 3</option>
      <option>Option 4</option>
      <option>Option 5</option>
      <option>Option 6</option>
    </select>
    <label for="select_1">Select 1</label>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您只需再次拨打material_select()即可。

请注意，:first用于选择option的{​​{1}}定位<option disabled selected>Choose your option</option>。

＆＃13;

＆＃13;

$(function(){
  $('select').material_select();
 
  var select = $('#select_1');
  
  select.find('option:eq(2)').prop('selected', true);
  select.material_select();
 
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>

<div class="row">
  <div class="input-field col s12">
    <select id="select_1" name="select_1">
      <option disabled selected>Choose your option</option>
      <option>Option 1</option>
      <option>Option 2</option>
      <option>Option 3</option>
      <option>Option 4</option>
      <option>Option 5</option>
      <option>Option 6</option>
    </select>
    <label for="select_1">Select 1</label>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;