我正在为学校做一个项目,这是一个有许多随机小项目的网站。 在其中一个项目中,我嵌入了一个带有src链接“... blah ... / Ndub1”的视频,如果你将链接中的“1”更改为“2”,那么你就得到了下一个视频。现在我正在尝试编写一个javaScript脚本,在单击按钮时将该数字更改为“number + 1”或“number - 1”。这是我网站的源代码:
<html>
<head>
<!-- some stuff -->
<script>
var e = "1";
var s = "0";
function narutoGetEpisodeGen() {
var a, link, link2;
e = document.getElementById('episodeInput').value
if (document.getElementById('naruto').checked) {
a = "Ndub" + document.getElementById('episodeInput').value;
s = 0;
}
else {
a = "Nshipdub" + document.getElementById('episodeInput').value;
s = 1;
}
link = '<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&plugins=timeslidertooltipplugin-2" height="480" width="720">';
link2 = '<video width="720" height="480" controls><source id="videoEmbeddedVid" src="http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&&autoplay=0" type="video/webm">Your browser does not support the video tag.</video>';
document.getElementById('embeddedVideoDiv').innerHTML = link;
document.getElementById('videoVidDiv').innerHTML = link2;
document.getElementById('episodeInput').value = "";
}
function oneForward() {
var a, z, link;
if (s == 0) {
z = eval(parseInt(e)+1);
a = "Ndub"+z.toString();
e += 1;
}
else {
z = eval(parseInt(e)+1);
a = "Nshipdub"+z.toString();
e += 1;
}
link = '<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&plugins=timeslidertooltipplugin-2" height="480" width="720">';
link2 = '<video width="720" height="480" controls><source id="videoEmbeddedVid" src="http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&&autoplay=0" type="video/webm">Your browser does not support the video tag.</video>';
document.getElementById('embeddedVideoDiv').innerHTML = link;
document.getElementById('videoVidDiv').innerHTML = link2;
}
function oneBack() {
var a, x, link;
if (s == 0) {
x = eval(parseInt(e)-1);
a = "Ndub"+x.toString();
e -= 1;
}
else {
x = eval(parseInt(e)-1);
a = "Nshipdub"+x.toString();
e -= 1;
}
link = '<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&plugins=timeslidertooltipplugin-2" height="480" width="720">';
link2 = '<video width="720" height="480" controls><source id="videoEmbeddedVid" src="http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&&autoplay=0" type="video/webm">Your browser does not support the video tag.</video>';
document.getElementById('embeddedVideoDiv').innerHTML = link;
document.getElementById('videoVidDiv').innerHTML = link2;
}
</script>
<!-- some stuff -->
</head>
<body>
<!-- some stuff -->
<p>Number of episode: <input type="text" id="episodeInput"/></p>
<p><label><input type="radio" name="narutoSeason" id="naruto"> Naruto</label></p>
<p><label><input type="radio" name="narutoSeason" id="narutoShippuden"> Naruto Shippuden</label></p>
<p><button type="button" id="submitButton" onclick="narutoGetEpisodeGen()">Submit</button></p>
<div id="embeddedVideoDiv">
<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/Ndub1&plugins=timeslidertooltipplugin-2" height="480px" width="720px">
</div>
<p><button type="button" onClick="oneBack()">Previous</button> <button type="button" onClick="oneForward()">Next</button></p>
<!-- some stuff -->
</body>
</html>
所以主要的问题是我从数字中添加或减去1的部分。我第一次使用oneForward按钮时它工作正常,但是下次我使用那个按钮时,它只会在我开始的剧集数量上加“1”。然后,如果我使用相同的按钮,错误会一直重复,但如果我使用另一个按钮,则会停止发生,并且从那时起它就能正常工作。 为了让我的自我更清楚,我会输入一些我正在做的事情的例子。
- Type in the input(id="episodeInput"): 3 > click on input(id="narutoShippuden") > click the button(id="submitButton") > observe how the function("narutoGetEpisode") did its job perfectly > click the button(onClick="oneForward") > observe the function working just fine (transformed the number from "3" to "4") > click the button(onClick="oneForward") again > observer how the link in embedded part transformed the number into "31" > click the button(onClick="oneForward") again > observer how the link in embedded part transformed the number into "311" > click the button(onClick="oneForward") again > observer how the link in embedded part transformed the number into "3111" > click the button(onClick="oneForward") again > observer how the link in embedded part transformed the number into "31111" > click the button(onClick="oneBack") > observe the function working just fine (transformed the number from "31111" to "31110") > from here on, both buttons act just fine
- Type in the input(id="episodeInput"): 3 > click on input(id="narutoShippuden") > click the button(id="submitButton") > observe how the function("narutoGetEpisode") did its job perfectly > click the button(onClick="oneForward") > observe the function working just fine (transformed the number from "3" to "4") > click the button(onClick="oneBack") > observer how the link in embedded part transformed the number into "30" > click the button(onClick="oneForward") again > observe how the button did its job okay (transforms the number from "30" to "31") > click the button(onClick="oneForward") again > observe how the button did its job okay (transforms the number from "31" to "32") > click the button(onClick="oneBack") again > observe how the button did its job okay (transforms the number from "32" to "31") > from here on, both buttons act just fine
- Type in the input(id="episodeInput"): 3 > click on input(id="narutoShippuden") > click the button(id="submitButton") > observe how the function("narutoGetEpisode") did its job perfectly > click the button(onClick="oneBack") > observe the function working just fine (transformed the number from "3" to "2") > click the button(onClick="oneBack") > observe the function working just fine (transformed the number from "2" to "1") > from here on, both buttons act just fine
我还应该提到,这种情况发生在Mozilla,Chrome和IE(所有这些都是最新的)中。
因此,当我通过头脑风暴来解决这个问题并搜索论坛时,我尝试了很多变种来修复代码,所以现在我要输入我测试过的东西并且工作得很简单或更糟:
要明确我只是在标题中的“script”标签中添加了代码,更准确地说,只是在这些行中:
function oneForward() {
var a, z, link;
if (s == 0) {
z = eval(parseInt(e)+1);
a = "Ndub"+z.toString();
e += 1;
}
else {
z = eval(parseInt(e)+1);
a = "Nshipdub"+z.toString();
e += 1;
}
link = '<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&plugins=timeslidertooltipplugin-2" height="480" width="720">';
link2 = '<video width="720" height="480" controls><source id="videoEmbeddedVid" src="http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&&autoplay=0" type="video/webm">Your browser does not support the video tag.</video>';
document.getElementById('embeddedVideoDiv').innerHTML = link;
document.getElementById('videoVidDiv').innerHTML = link2;
}
function oneBack() {
var a, x, link;
if (s == 0) {
x = eval(parseInt(e)-1);
a = "Ndub"+x.toString();
e -= 1;
}
else {
x = eval(parseInt(e)-1);
a = "Nshipdub"+x.toString();
e -= 1;
}
link = '<embed type="application/x-shockwave-flash" src="http://cdn.directvid.com/jwplayer/player.swf" style="undefined" name="embeddedVid" quality="high" allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="autostart=&stretching=exactfit&type=video&skin=http://cdn.directvid.com/jwplayer/nemesis1.zip&file=http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&plugins=timeslidertooltipplugin-2" height="480" width="720">';
link2 = '<video width="720" height="480" controls><source id="videoEmbeddedVid" src="http://www.animefun.com/dl/googDev.php?url=/112965806382805543465/' + a + '&&autoplay=0" type="video/webm">Your browser does not support the video tag.</video>';
document.getElementById('embeddedVideoDiv').innerHTML = link;
document.getElementById('videoVidDiv').innerHTML = link2;
所以我改变了
z = eval(parseInt(e)+1);
a = "Nshipdub"+z.toString();
到
z = (parseInt(e)+1);
a = "Nshipdub"+z.toString();
或
z = (e+1);
a = "Nshipdub"+z.toString();
或
a = "Nshipdub"+(e+1);
或
a = "Nshipdub"+(e*1+1);
或
a = "Nshipdub"+(parseInt(e)+1);
或
a = "Nshipdub"+(parseInt(e)*1+1);
或
a = "Nshipdub"+(parseInt(e)+1).toString();
和其他一些我甚至都不记得的了。无论如何,他们都没有更好。
我真的很感激这方面的一些帮助,也解释了为什么上面的例子不会起作用,特别是那些带有另一个变量的例子,因为我在论坛上看到的例子说&gt;“string”+ 3 + 1“&lt ;等于&gt;“string +”3“+”1“&lt;并且&gt; 1 + 5 +“字符串”&lt;等于&gt; 6 +“string”&lt;。
答案 0 :(得分:2)
&#34;为什么JavaScript会将整数变量强制转换为字符串变量?&#34;
因为,呃......
var e = "1";
您将其定义为字符串?
e = document.getElementById('episodeInput').value
两次?
尝试:
var e = 1;
和
e = parseInt(document.getElementById('episodeInput').value,10);