javascript - 如何在不使用内联 javascript 的情况下修改选择下拉列表的默认值？

Question

在 Chrome 扩展程序中，Google 不允许我们将内联 javascript 添加到 popup.html。因此，唯一的选择是链接到外部脚本。

我有以下内容：

脚本.js：

if (localStorage.getItem("mySelectValue") === null) { 
    document.write("choose a value"); 
}
else {
    document.write(localStorage.getItem('mySelectValue'));
}

popup.js：

$(document).ready(function(){
    $('#mySelectValue').change(function(){
         localStorage.setItem('mySelectValue', $(this).val());
         $('#mySelectValue').value(localStorage.getItem('mySelectValue'));
    });
});

popup.html：

<script type="text/javascript" src="popup.js"></script>

<select id="mySelectValue">
   <option name="" value=""><script type="text/javascript" src="script.js"></script></option>
       <option value="first" name="first">first</option>
       <option value="second" name="second">second</option>
       <option value="third" name="third">third</option>
</select>

此代码成功显示文本，但我无法以这种方式将脚本添加到值中。那么如何使用相同的方法将本地存储中的给定值也定义为值呢？

Answer 1

在 jQuery 中，您可以执行以下操作：

$("#mySelectValue option[value='"+localStorage.getItem('mySelectValue')+"']").attr("selected","selected");

这基本上会找到option与您获得的值相同的 ，localStorage.getItem('mySelectValue')并默认选择它。