开发指南--浏览器用户界面--选项页面(Options)
选项(Options)
你可能想通过提供一个选项页，来允许用户对你的扩展进行自定义配置。如果这样做，系统会在扩展程序管理页面(chrome://extensions)中提供一个链接指向它。点击选项链接会打开一个新的标签页来指向你的选项页面。
<html><head><title>My Test Extension Options</title></head><script type="text/javascript">// 将选项保存到localStorage。function save_options() { var select = document.getElementById("color"); var color = select.children[select.selectedIndex].value; localStorage["favorite_color"] = color; // 更新状态，让用户知道选项被保存。 var status = document.getElementById("status"); status.innerHTML = "Options Saved."; setTimeout(function() { status.innerHTML = ""; }, 750);}// 根据localStorage中保存的值恢复选择框的状态。function restore_options() { var favorite = localStorage["favorite_color"]; if (!favorite) { return; } var select = document.getElementById("color"); for (var i = 0; i < select.children.length; i++) { var child = select.children[i]; if (child.value == favorite) { child.selected = "true"; break; } }}</script><body onload="restore_options()">Favorite Color:<select id="color"> <option value="red">red</option> <option value="green">green</option> <option value="blue">blue</option> <option value="yellow">yellow</option></select><br><button onclick="save_options()">Save</button></body></html>
重要说明
这个功能在4.0.222.x版本后的某个正式主干版本中加入。原文 写道This feature is checked in to the trunk and should land in official builds sometime after version 4.0.222.x.我们计划提供一些默认的CSS样式，以使不同扩展的选项页面外观一致。你可以在crbug.com/25317中加星来促进更新。原文 写道We plan on providing some default css styles to encourage a consistent look across different extensions' options pages. You can star crbug.com/25317 to be notified of updates.
