Question

在我的谷歌浏览器扩展程序options.html中，我使用链式选择来获取我存储在chrome.storage中的值，这非常有用。

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

以下是我的问题的一个小例子：http://jsfiddle.net/timw1984/2hxzem1e/2/

正如您可以看到按钮单击时的第一个选择更改，但第二个没有。

options.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>

options.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);

谢谢！

添

Answer 1

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

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

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

Your JSFiddle, patched

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

1 个答案: