jquery.chained.min.js设置值为第二个选择

jquery.chained.min.js set value of 2nd select

本文关键字：第二个 选择 设置 chained min js jquery      更新时间：2023-09-26

在我的谷歌浏览器扩展选项.html中，我使用链式选择来获取存储在chrome.storage中的值，效果很好。

现在，当我重新打开我的选项时.html我想从我的chrome.storage中获取这些值，并将链接的选择再次设置为这些值。我的代码用于设置第一个选择，但第二个选择保持为空。如何将这两个选择都设置为chrome.storage值？

这是我问题的一个小提琴示例：http://jsfiddle.net/timw1984/2hxzem1e/2/

如您所见，第一个选择在单击按钮时发生了变化，但第二个选择没有。

选项.html：

<select id="choose-channel" name="accounts">
    <option value="MLB">MLB</option>
    <option value="NFL">NFL</option>
    <option value="2">NBA</option>
</select>
<select id="choose-channel-2" name="searches">
<option class="MLB" value="Orioles">Orioles</option>
<option class="MLB" value="RedSox">Red Sox</option>
<option class="MLB" value="Yankees">Yankees</option>
<option class="NFL" value="49ers">49ers</option>
<option class="NFL" value="Bears">Bears</option>
<option class="NFL" value="Bengals">Bengals</option>
</select>

选项.js：

    var team, sport ;
$("select").addClass("ui-selectmenu-button ui-widget ui-state-default ui-corner-all");
$("#choose-channel-2").chained("#choose-channel");
chrome.storage.sync.get({
        sport1:"MLB",
        favoriteTeam: 'RedSox'
    }, function(items) {
        document.getElementById('choose-channel').value = items.sport1;
        document.getElementById('choose-channel-2').value = items.favoriteTeam;
    });
}
document.addEventListener('DOMContentLoaded', restore_options);
document.getElementById('save').addEventListener('click',
    save_options);

谢谢！

提姆

仅通过 .val()/.value 设置值通常不会触发与输入元素交互相同的处理类型。

您应该触发一个事件，指示值已更改：

$('#choose-channel').val(items.sport1).change(); // or .trigger("change")
$('#choose-channel-2').val(items.favoriteTeam).change();

你的JSFiddle，打了补丁。

相关文章：