Javascript记住从下拉菜单中选择的选项值

问题描述:

做一点研究我现在知道我必须编写所选选项的cookie。然后读取该cookie以检索该值。Javascript记住从下拉菜单中选择的选项值

我发现了一个类似的问题,但无法弄清楚如何从答案

Link to question

<html> 
<head> 
<title>dropdown remember selection test</title> 
</head> 
<body> 

<iframe id="stream_iframe" marginwidth="0" marginheight="0" width="854" height="480" scrolling="no" allowtransparency="true" frameborder="0" framespacing="0" name="stream_iframe" src="http://vaughnlive.tv/embed/video/moviebay"></iframe> 

<form> 
<select name="options" onchange="document.getElementById('stream_iframe').src = this.options[this.selectedIndex].value"> 
<option>SELECT STREAM 
<option value="https://streamup.com/rooms/jumanjijoes-Channel/plugins/video/show?startMuted=false">Jumanjijoe</option> 
<option value="http://vaughnlive.tv/embed/video/whenlinkattacks">Whenlinkattacks</option> 
<option value="https://streamup.com/rooms/docblus-Channel/plugins/video/show?startMuted=false">Docblu</option> 
<option value="http://vaughnlive.tv/embed/video/karenwaifu">Karenmaiwaifu</option> 
<option value="http://vaughnlive.tv/embed/video/ninjatart">Nightsanity</option> 
<option value="http://vaughnlive.tv/embed/video/frightfest0001">Frightfest0001</option> 
<option value="http://vaughnlive.tv/embed/video/anime_hq">Anime HQ</option> 
<option value="http://vaughnlive.tv/embed/video/moviebay">MovieBay</option> 
<option value="http://vaughnlive.tv/embed/video/freakyfetish101">Horror Movie</option> 
<option value="http://vaughnlive.tv//embed/video/111aaacharkmovies">111aaacharkmovies </option> 
</select> 
</form> 

</body> 
</html> 

我设法创建一个下拉菜单,这将改变IFRAME SRC执行代码。我只需要它来记住他们在刷新或浏览器退出时选择的内容。

对于这个当用户选择保值的价值,您的浏览器是本地/或会话存储,当用户重新打开先检查本地存储是否具有价值或者如果不使用jQuery是选择价值。

// Store 
localStorage.setItem("lastname", "Smith"); 
// Retrieve 
document.getElementById("result").innerHTML = localStorage.getItem("lastname"); 

你可以看到如何在W3School使用本地存储: http://www.w3schools.com/html/html5_webstorage.asp

编辑:

找到完整的代码下面

<iframe id="stream_iframe" marginwidth="0" marginheight="0" width="854" height="480" scrolling="no" allowtransparency="true" frameborder="0" framespacing="0" name="stream_iframe" src="http://vaughnlive.tv/embed/video/moviebay"></iframe> 

<form> 
<select name="options" onchange="callMe(this);" id="selectMovie"> 
<option>SELECT STREAM 
<option value="https://streamup.com/rooms/jumanjijoes-Channel/plugins/video/show?startMuted=false">Jumanjijoe</option> 
<option value="http://vaughnlive.tv/embed/video/whenlinkattacks">Whenlinkattacks</option> 
<option value="https://streamup.com/rooms/docblus-Channel/plugins/video/show?startMuted=false">Docblu</option> 
<option value="http://vaughnlive.tv/embed/video/karenwaifu">Karenmaiwaifu</option> 
<option value="http://vaughnlive.tv/embed/video/ninjatart">Nightsanity</option> 
<option value="http://vaughnlive.tv/embed/video/frightfest0001">Frightfest0001</option> 
<option value="http://vaughnlive.tv/embed/video/anime_hq">Anime HQ</option> 
<option value="http://vaughnlive.tv/embed/video/moviebay">MovieBay</option> 
<option value="http://vaughnlive.tv/embed/video/freakyfetish101">Horror Movie</option> 
<option value="http://vaughnlive.tv//embed/video/111aaacharkmovies">111aaacharkmovies </option> 
</select> 
</form> 
<script> 
function callMe(obj){ 
localStorage.setItem("selectedStream",obj.options[obj.selectedIndex].value); 
document.getElementById('stream_iframe').src = obj.options[obj.selectedIndex].value; 
} 
document.getElementById("stream_iframe").src = localStorage.getItem("selectedStream"); 
document.getElementById("selectMovie").value = ""+localStorage.getItem("selectedStream")+""; 
</script> 
+0

我知道我要存储值问题我不知道如何使用表格 它会是这样的? //商店 localStorage.setItem( “selectedStream”, “值”); //检索 document.getElementById(“stream_iframe”)。innerHTML = localStorage.getItem(“selectedStream”); – Yami

+0

我已添加完整的代码。将其复制到html文件并在浏览器上运行。 – amitguptageek

+0

谢谢你通过代码看我现在更好地理解它现在谢谢你。 src在第一次运行时变为空。 – Yami