Question

我的iframe src有点问题。我设置了一个下拉列表，用于更改iframe src url，然后保存选择。一切正常，除非你第一次加载网页时我得到404错误，iframe src变为null。我尝试手动设置网址并使用脚本来更改网址，但这打破了保存选择。谢谢你的时间。

修改感谢 lorefnon ，他指出我正确的方向，我能够在这里创建一个修复程序是完整的工作代码。

<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="callMe(this);" id="selectMovie">
<option value="" disabled selected>SELECT STREAM</option>
<option value="http://vaughnlive.tv/embed/video/ninjatart">Nightsanity</option>
<option value="http://vaughnlive.tv/embed/video/111aaacharkcomedy">ComedyCentral</option>
<option value="http://vaughnlive.tv/embed/video/ducktoaster">JPGameShow</option>
<option value="http://vaughnlive.tv/embed/video/lmshows_mws">SurvivalReality</option> 
<option value="http://vaughnlive.tv/embed/video/cyberjedi">TV Series</option>
<option value="http://vaughnlive.tv/embed/video/anime_hq">Anime HQ</option>
<option value="http://vaughnlive.tv/embed/video/animationnation101">Toons</option>
<option value="http://vaughnlive.tv/embed/video/frightfest0001">Horror Movies 1</option> 
<option value="http://vaughnlive.tv/embed/video/freakyfetish101">Horror Movies 2</option>
<option value="http://vaughnlive.tv/embed/video/moviebay">MovieBay</option>
<option value="http://vaughnlive.tv//embed/video/111aaacharkmovies">Movies</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;
}

var selectedStream = localStorage.getItem("selectedStream");

if (localStorage.getItem("selectedStream") === null) {
  document.getElementById("stream_iframe").src =  "https://streamup.com/acgn_music_box/embeds/video?startMuted=false"; 
} else {
    document.getElementById("stream_iframe").src =   localStorage.getItem("selectedStream");
    document.getElementById("selectMovie").value =  ""+localStorage.getItem("selectedStream")+"";
}
</script>
</body>
</html>

Answer 1

问题是，当您的代码第一次运行时，localStorage.getItem将返回null，该值将分配给iframe的src属性。

您可以检查这种情况，也可以不做任何事情，在这种情况下，html中的现有src将得到尊重，或者您可以指定＆＃39; about：blank＆＃39;显示没有404错误的空白页面。

<script>
function callMe(obj){
localStorage.setItem("selectedStream",obj.options[obj.selectedIndex].value);
document.getElementById('stream_iframe').src =   obj.options[obj.selectedIndex].value;
}

var selectedStream = localStorage.getItem("selectedStream");

if (selectedStream) {
  document.getElementById("stream_iframe").src = selectedStream;
  document.getElementById("selectMovie").value = selectedStream;
} else {
  document.getElementById("stream_iframe").src =  "about:blank"; 
}

</script>

Javascript iframe src仅在开始时变为Null

1 个答案: