神奇：js一个函数里定义了两个变量，其中一个变量在另一个函数里也能调用，另一个变量却不能调用

oooome 2014-04-12 11:10:13

页面代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
html,body{height:100%;overflow:hidden;}
#popupcontent{
position: absolute;
visibility: hidden;
overflow: hidden;
border:1px solid #CCC;
background-color:#F9F9F9;
border:1px solid #333;
padding:5px;
margin:100px;
z-index:3;
}
#popup1{
position: absolute;
z-index:2;
background:url(images/graybg.png);
visibility: hidden;
}
.h1{ width:400px;height:36;font:32px 微软雅黑,PTSansNarrow,sans-serif;font-weight: bold;color: #6666FF; padding-bottom:16px;}
.main1{ width:424px; height:236; background:#FFFFFF;margin-top:100px;padding:10px;border:solid #33CCFF 1px;}
.input1{
border:#ffffff 0px solid;
background-Color: #FF0080;
color:#ffffff;
padding:0 5px 5px 0;
font:32px 微软雅黑,PTSansNarrow,sans-serif;
font-weight:bold;
width:100px;
}
</style>
<script type="text/javascript">
var baseText = null;
function showPopup(w,h){
var popup1=document.getElementById("popup1");
var popup = document.getElementById("popupcontent");
popup.style.width = w + "px";
popup.style.height = h + "px";
popup1.style.width="100%";
popup1.style.height="100%";
popup.style.visibility = "visible";
popup1.style.visibility = "visible";
}
function areacook() {
var popup = document.getElementById("popupcontent");
var radio1=document.getElementsByName("area");
for(var i=0;i<radio1.length;i++){
if (radio1.item(i).checked==true){
var exp = new Date();
exp.setTime(exp.getTime() + 30*24*60*60*1000);
document.cookie = "area" + "="+ escape(radio1.item(i).value) + ";expires=" + exp.toGMTString();
popup.style.visibility = "hidden";
popup1.style.visibility = "hidden";
break;
}
}
}
</script>
</head>
<body onload="showPopup(424,236);">
<center><div class="main1" id="popupcontent">
<div class="h1">选择区域</div>
<div>
<label class="input1"><input name="area" type="radio" checked="true" value="1" />金水区</label>
<label class="input1"><input name="area" type="radio" value="2" />中原区</label>
<label class="input1"><input name="area" type="radio" value="3" />管城区</label>
<br><br>
<label class="input1"><input name="area" type="radio" value="4" />高新区</label>
<label class="input1"><input name="area" type="radio" value="5" />经开区</label>
<label class="input1"><input name="area" type="radio" value="6" />惠济区</label>
<br><br>
<button onClick="areacook()">确定</button>
</div>
</div></center>
<div id="popup1"></div>
<div>this is a test message.</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>

...全文

770 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

搬砖de蚂蚁 2014-04-14

打赏
举报

肯定是你代码有问题，没有什么神奇的。。

神之左手 2014-04-14

打赏
举报

JS中变量作用域如下 1.一般顺序代码中定义的变量本质可以看成公用变量可以在任意位置调用 2.函数体中定义的变量，一般只有在该函数体中使用，没有办法在该函数之外或者其他函数中使用 3.特殊情况，比如变量重名，对象属性等等，这个要自己体会就你这个问题，可能如楼上描述DOM元素带id的或者在浏览器中会有自己的同名对象，但极力不建议用这些浏览器的该特性，因为非通用所以按上面的作用域说法，你就应该在顺序代码中靠前的位置把需要多个函数使用的公共变量定义好，而不是定义在函数体中

oooome 2014-04-12

打赏
举报

引用 3 楼 u011461314 的回复:

不神奇，这 popup1 popupcontent 直接可用了。早就存在了。

确实是，我发现这里直接用id就行了，没必要用document.getElementById再定义变量。

zhjdg 2014-04-12

打赏
举报

不神奇，这 popup1 popupcontent 直接可用了。早就存在了。

人生难得一只鸡 2014-04-12

打赏
举报

var popup1=document.getElementById("popup1"); var popup = document.getElementById("popupcontent"); 你可以放在函数外边，定义为全局变量，供所有函数使用你之前的处理，肯定是访问不到的，也许出现了错误，只不过页面看上去还算正常，也许你可以通过开发者人员工具来查看控制台所出现的错误

oooome 2014-04-12