传单easyButton；将下拉列表设置为预定义选项的困难

Question

我正在尝试创建一个将下拉列表的值更改为特定选项的 easyButton 实例。我用来更改选项值的方法在代码其他地方的 easyButton 实例之外起作用。 easyButton 还会将预期值打印到控制台，否则工作正常。如果用于调用另一个函数，该函数会执行，但仍不会更改下拉列表的值。我真的不确定为什么会发生这种情况以及如何解决。简化代码片段如下：

HTML；下拉列表

<select id="select">
    <option id="1">Option 1</option>
    <option id="2">Option 2</option>
    <option id="3">Option 3</option>
</select>

JS脚本；传单easyButton。

    L.easyButton('<img src="./images/HomeIcon.png">', function(btn, map){
        $("#select option[id=3]").attr('selected', 'selected');
    }).addTo(mymap);

主要要强调的是，选择器 $("#select option[id=5]").attr('selected', 'selected'); 一直有效，直到我将它放入 Leaflet easyButton 中。

非常感谢您的帮助，特别是如果我能够理解我做错了什么以及我将来应该做什么的话。

Answer 1

将 id 更改为值：

<select id="select">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

然后调用：

  L.easyButton('<img src="./images/HomeIcon.png">', function(btn, map){
        $("#select").val(3)
  }).addTo(map);

https://jsfiddle.net/falkedesign/nzrbpw6v/

传单easyButton；将下拉列表设置为预定义选项的困难

Leaflet easyButton; Difficulties setting a dropdown list to a predfined option

javascript

leaflet

jquery-selectors

dom-manipulation