从另一个 button/llink 激活下拉选项

Question

我一直在努力研究如何做到这一点。我在一个页面上有一个下拉菜单，我无法控制代码 -

<select name="dex_item" id="dex_item" onchange="dex_updateItem()">
<option value=1>2016</option>
<option value=4>2017</option>
<option value=5>2018</option>
</select>

我想创建一个简单的 button/link，单击它会激活其中一个选项。因此，例如，当我单击#click 时，将选择选项值=4。

我见过类似的示例，但无法正常工作...

Answer 1

检查这个：https://jsfiddle.net/c2yusbka/

单击按钮后，您可以设置 select 元素的值，该选项将相应地 select 编辑。

$('#click').click(function(){ 
   $("#dex_item").val("4");
});

$('#click').click(function(){ 
   $("#dex_item").val("4");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="dex_item" id="dex_item" onchange="dex_updateItem()">
  <option value=1>2016</option>
  <option value=4>2017</option>
  <option value=5>2018</option>
</select>
<button id="click">Click Here</button>

Answer 2

您可以使用 .prop() 将 selected 属性添加到目标 option

$("button").click(function(){
    $("select > option[value='4']").prop("selected", true);
    $("select").change();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="dex_item" id="dex_item" onchange="console.log('changed')">
    <option value=1>2016</option>
    <option value=4>2017</option>
    <option value=5>2018</option>
</select>
<button>click</button>

Answer 3

也许我误解了但是要select一个select输入的值你可以使用下面的代码：

$("#click").click(function(e) {
  $("#dex_item").val('4');
});

https://jsfiddle.net/Tintin37/fmncst9L/

编辑

如果你想触发 onchange 事件，你可以这样做：

 $(function() {
   $("#click").click(function(e) {
     var select = $("#dex_item");
     select.val('4').trigger("change");
   });
 })

 function dex_updateItem() {
   alert("change");
 }

https://jsfiddle.net/Tintin37/z2bnvuru/

从另一个 button/llink 激活下拉选项

Activate a dropdown option from another button/llink

jquery

select

click

dropdown