ajax怎么让页面跳出遮罩层修改数据后提交到后台

遮罩层：

<div id="zezhao">

<form id='biaodan'>

<input type='text' size='200' id='text'>

<input type='submit' value='提交'>

</form>

</div>

function send(){

var url = "提交的页面.php"

var fm = document.getElementById('biaodan')

var data = new FormData(fm)

var xhr = new XMLHttpRequest()

xhr.onreadystatechange = function(){

if(xhr.readyState==4){

if(xhr.status == 200){

//表单域信息归位

//document.getElementById('content').value=""//消息

//3秒后使得发表留言的信息消失

//setTimeout("hideresult()",3000)

}

}}

//xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')

xhr.open('post',url,true)

xhr.send(data)

}

//如果你用数据库显示，下面的就不需要了。

function getmessage(){

xhr.onreadystatechange = function(){

if(xhr.readyState == 4){

if(xhr.status == 200){

//实际 *** 作

result.innerHTML += xhr.responseText

}

result.scrollTop = result.scrollHeight

}

/* var show = document.getElementById('result')

show.innerHTML= */

}

//发送请求

xhr.open('get','提交的页面.php',true)

xhr.send()

}

window.onload = function(){

getmessage() //修改后原页显示

}

ajax里面有一个属性是async

async代表是否异步，当你把他设置为false的时候，则非异步即同步，也就是js代码运行到这里的时候，所有的页面代码都不会加载，当ajax传回数据后，页面代码才恢复加载，在这之前符合题主的题目要求。

async的默认值为true，即为异步。

当然如果题主非要是异步完成所问需求的话，那么可以在执行前加一个遮罩层，这样加载的时候就点不动其他地方了，加载结束后让遮罩层关闭即可。

顺便说一下，如果页面有太多ajax请求，都为同步的话，页面会比较慢，照成用户体验不好的哦。

添加一个全局的bool类型状态变量，用来表明当前画面是否已经提交过。默认给这个变量一个flase，在你textbox的回车事件方法里，判断这个变量的值,确认是否是第一次提交，如果是的话就提交画面，并且把这个变量的值改为true，表示已经提交过一次。 当你再点回车触发这个这个事件 ，这个时候状态变量的值已经为true了，就不再提交画面就可以了！

---