如何在页面加载时更改下拉框的选项？

Question

我是一名正在从事项目开发的IT技术翻译。有一项任务需要我选择下拉框中的特定选项，我知道如何实现这个过程，但问题在于每当下拉框的值发生改变时，必须调用一个函数。手动更改选项时可以正常工作，但使用jQuery onload时，该函数无法正常工作，因为它仅在用户手动更改下拉框选项时才能正常工作。请告诉我如何解决这个问题。

例子：

          <select>
               <option val="0" selected></option>
               <option val="1"></option>
               <option val="2"></option>
               <option val="3"></option>
               <option val="4"></option>
               <option val="5"></option>
          </select>

以下是我尝试过的一些努力：

这里是一些我尝试过的努力：

$("select").val('5');

- Amrinder Singh

---

我记得我曾经遇到过类似的问题。在设置值后，只需调用$("select").change()即可。 - Nomeaning25

这是正在运行的网站，http://54.66.136.29/SplitsBrowser/splits-graph-template.html，我只需要从下拉菜单中选择最后一个选项，并且还需要自动调用手动更改时运行的函数，只需选择页面顶部可以看到的下拉菜单中的最后一个值。 - Amrinder Singh

您的网站正在通过AJAX加载其内容，因此您无法在加载时运行任何内容 - 您需要在AJAX调用完成后更新选择器。 - Rory McCrossan

你可以在控制台中测试它，一旦值改变就触发更改事件。Rory是正确的。 - A. Wolff

Answer 1

您希望在页面首次加载时预先选择一个选项吗？

这段 jQuery 代码将查找值为5的option并将其选中。通过将其包装在jQuery(document).ready函数中，它将在页面加载后运行。

jQuery(document).ready(function($){
  $('select').find('option[value=5]').attr('selected','selected');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<select>
    <option value="0" selected>0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

- Richard Parnaby-King

---

在我能够解决的所有问题中，就是这个问题。我尝试了所有这些解决方案，但是那个该死的列表框就是不会选择。 - mike01010

Answer 2

猜猜看，这很简单。

您的选择组件：

<select id="YourSelectComponentID">
            <option value="0">Apple</option>
            <option value="2">Banana</option>
            <option value="3">Cat</option>
            <option value="4">Dolphin</option>
</select>

将此内容复制并粘贴到您的JavaScript部分。

$(function(){
   document.getElementById("YourSelectComponentID").value = 4;
});

现在每次页面加载时，选项4将被选中。

- Majid Ali Khan

Answer 3

使用这个方法，你可以在页面加载时改变下拉框的值。

jQuery(document).ready(function($){
  $('select').find('option[value=USD]').attr('selected','selected');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<select>
   <option value="JPY">Japanese yen (JPY)</option>
<option value="AFN">Afghan afghani (AFN)</option>
<option value="ALL">Albanian lek (ALL)</option>
<option value="DZD">Algerian dinar (DZD)</option>
<option value="AOA">Angolan kwanza (AOA)</option>
<option value="ARS">Argentine peso (ARS)</option>
<option value="AMD">Armenian dram (AMD)</option>
<option value="AWG">Aruban florin (AWG)</option>
<option value="USD">United States dollar (USD)</option>
</select>

- Ganesh Putta