JavaScript全局变量和局部变量实例

原创 2015年11月19日 16:36:48

w3school网站PHP AJAX样例中,有一个类似百度的实时搜索框界面,当输入关键词时则下方弹出与关键相关的搜索内容。于是我结合bootstrap对界面进行了美化,在编写过程中遇到了个奇怪的问题。浏览器端怎么都弹不出提示内容,到底问题出在哪里?

1.首先我用httpwatch抓包工具实时监测了请求头和响应头,发现数据能提交,响应数据也成功接收,可排除服务端PHP脚本的问题。

2.问题可能出在JS脚本上,我设定的是当用户在文本框中输入文本时,弹出搜索提示。数据可以提交,但是无法显示,显然是接收操作出了问题。

3.当XMLHttpRequest对象的onreadystatechange事件触发时,执行stateChanged函数。

//调用XMLHTTP 对象的onreadystatechange事件,并在触发一个变化时告知此函数执行名为 stateChanged 的一个函数
xmlHttpObject.onreadystatechange=stateChanged;

4.在stateChaned函数中判断响应状态,若响应数据准备完毕则处理响应数据。

//处理响应数据
function stateChanged(){
	//判断响应数据是否准备就绪
	if (xmlHttpObject.readyState==4 || xmlHttpObject.readyState=="complete") {
		document.getElementById("livesearch").innerHTML = xmlHttpObject.responseText;
		document.getElementById("livesearch").style.border = "1px solxmlHttpObject.responseTextid #333";
	}
}

5.乍一看好像没问题,于是我添加了else语句,并注释其他语句,只通过alert弹窗提示信息。

//处理响应数据
function stateChanged(){
	//判断响应数据是否准备就绪
	if (xmlHttpObject.readyState==4 || xmlHttpObject.readyState=="complete") {
		alert('YES');
		//document.getElementById("livesearch").innerHTML = xmlHttpObject.responseText;
		//document.getElementById("livesearch").style.border = "1px solxmlHttpObject.responseTextid #333";
	}else{
		alert('NO');
	}
}

6.然而我发现这样做并没有什么卵用,我就纳闷了,难道两种情况都不触发吗?于是我判断,可能是触发条件有问题,于是我分别在在条件判断之前和之后alert。

(1)条件之前:噔噔噔噔,当我按下按键时连弹出4个提示框,这应当是readState的4种状态

//处理响应数据
function stateChanged(){
	alert('hello');
	//判断响应数据是否准备就绪
	if (xmlHttpObject.readyState==4 || xmlHttpObject.readyState=="complete") {
		alert('YES');
		//document.getElementById("livesearch").innerHTML = xmlHttpObject.responseText;
		//document.getElementById("livesearch").style.border = "1px solxmlHttpObject.responseTextid #333";
	}else{
		alert('NO');
	}
}


:
(2)条件之后:嗯,什么都没有,如此判断定然是if语句的条件出问题了。

//处理响应数据
function stateChanged(){
	
	//判断响应数据是否准备就绪
	if (xmlHttpObject.readyState==4 || xmlHttpObject.readyState=="complete") {
		alert('YES');
		//document.getElementById("livesearch").innerHTML = xmlHttpObject.responseText;
		//document.getElementById("livesearch").style.border = "1px solxmlHttpObject.responseTextid #333";
	}else{
		alert('NO');
	}
	alert('hello');
}


7.经过仔细检查发现这条件貌似没问题啊,于是我比对w3school的源码,发现源码中XMLHttpObject被声明在函数外,而我是在函数内声明的,难道是因为声明为局部变量导致stateChanged函数无法访问它?于是我立马将其声明在函数外,测试弹出三个"NO",一个"YES",条件触发成功!泪流满面,终于找到原因了,接着我突然想到了什么,试着在函数内把xmlHttpObject的var声明关键字去掉直接使用,不在外面声明,也能弹出三个"NO",一个"YES",看来函数内不声明的变量默认为全局变量。

8.把alert去掉,看能不能弹出提示,很好,终于成了!


版权声明:本文为博主原创文章,未经博主允许不得转载。 举报

相关文章推荐

JavaScript全局变量和局部变量实例

w3school网站PHP AJAX样例中,有一个类似百度的实时搜索框界面,当输入关键词时则下方弹出与关键相关的搜索内容。于是我结合bootstrap对界面进行了美化,在编写过程中遇到了个奇怪的问题。...

02.变量和基本数据类型

变量: 变量的作用域(scope):变量起作用或有效的代码范围 变量的生存期(life time):变量存在的时间范围 根据变量的作用域将变量分为全局变量和局部变量 全局变量储存在静态数据区,...

我是如何成为一名python大咖的?

人生苦短,都说必须python,那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..

js局部变量和全局变量

function test2(){ alert ("before for scope:"+i); // i未赋值(并不是未声明!使用未声明的变量或函数全抛出致命错误而中断脚本执行) ...

Python全局变量和局部变量

简单地说,在python中,在函数内部定义的变量称为局部变量。在函数wai'bu

java全局变量和局部变量

全局变量是一个运行时刻实体,它在程序的整个执行过程中都存在。全局变量生命周期为程序开始到程序结束。 全局变量显示初始化时,或者未初始化时,在程序映像中有不同的分区:已初始化的全局变量是可执行模块的一...

C++ 全局变量和局部变量

转自 http://www.qiyeku.com/xinwen/45983.html   在讨论全局变量之前我们先要明白几个基本的概念: 1. 编译单元(模块):     在IDE开发工具大行...

js全局变量和局部变量

今天在群里讨论js的作用域问题,特此记录: 先看几个例子: var a =1; function test(){ alert(a); var a...

JS全局变量和局部变量

最近在学习JS时,发现对JS的全局变量和局部变量理解不够深入,特此做一下总结: 一 当局部变量和全局变量重名时,局部变量会覆盖全局变量.当离开局部变量的scope后,又重回到全局变量的scope,...

全局变量和局部变量

// scope.cpp, Maggie Johnson // Description: A program to illustrate different scopes #include us...

python全局变量和局部变量

当你在函数定义内声明变量的时候,它们与函数外具有相同名称的其他变量没有任何关系,即变量名称对于函数来说是 局部 的。这称为变量的 作用域 。所有变量的作用域是它们被定义的块,从它们的名称被定义的那点开...
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)