为什么JavaScript会将整数变量强制转换为字符串变量
Why does JavaScript force integer variables into string variables?
我正在为学校做一个项目，这个网站有很多随机的小项目。在其中一个项目中，我嵌入了一个视频，它有一个src链接"…blah…/Ndub1"，如果你把链接中的"1"改为，例如"2"，那么你就会得到下一个视频。现在，我正在尝试编写一个javaScript脚本，它将在单击按钮时将数字更改为"数字+1"或"数字-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();
还有一些我都不记得了。不管怎样，他们都没有好到哪里去。
我真的很感谢你的帮助，也很感谢你解释为什么上面的例子不起作用，尤其是那些有另一个变量的例子，因为我在论坛上读到的例子说>"string"+3+1"<等于>"string+"3"+"1"<并且>1+5+"字符串"<等于>6+"字符串"<。
"为什么JavaScript强制将整数变量转换为字符串变量？"
因为，呃。。。
var e = "1";
你把它定义为字符串？
e = document.getElementById('episodeInput').value
两次？
尝试：
var e = 1;
和：
e = parseInt(document.getElementById('episodeInput').value,10);
相关文章：
- 将标量变量转换为javascript中包含变量的数组
- 使用Javascript将多行变量转换为单行变量
- 变量转换为另一个“未定义”的变量
- 如何在javascript中将String变量转换为int
- 提交时将JavaScript变量转换为PHP表单
- 在d3.js中将局部变量转换为全局变量
- 在php函数中将php变量转换为javascript变量
- AngularJS变量转换为html<对象>属性
- 正在将字符串变量转换为数组
- 将变量转换为 json 路径
- 将 MVC 4 Razor 变量转换为 JavaScript 数组
- 如何在 JavaScript 中将局部变量转换为全局变量
- 如何将 jstl/JSP 变量转换为 JavaScript 变量
- 如何将变量转换为对象
- 如何使用 Javascript 将变量转换为字符串
- 在将会话变量转换为 javascript 变量时丢失特殊字符
- 如何在函数内将未定义的变量转换为对象
- 在按键和鼠标单击后将函数变量转换为全局变量
- 如何在javascript中将整数变量转换为字符串
- Javascript变量转换为Applescript
