码迷,mamicode.com
首页 > 编程语言 > 详细

html与javascript之网络篇

时间:2014-12-26 14:39:50      阅读:129      评论:0      收藏:0      [点我收藏+]

标签:表单   ajax   异步加载   同步加载   javascript   

此篇依然与前一篇动态篇环境一样,基于jquery

转载前请贴上博客链接,谢谢:http://blog.csdn.net/gugugujiawei

一、表单提交(post的同步加载)

                <form method="post" onSubmit="return check_recover()">	                          						
                    <a href="javascript:void(0)" id="allSelect2" >全部</a>
                    <a >-</a>                        
                    <a href="javascript:void(0)" id="noneSelect2" >无</a>
                    <a >-</a>                        
                    <input type="submit" class="btn btn-primary" name="recover" value="恢复所选"></input>           
                    <button type="button" class="btn btn-primary">删除所选</button>
                </form> 

解释:当点击submit对应的按钮时,会直接提交到服务器,当此前为调用check_recover()函数,在这个函数中可以判断提交的内容是否合法,如果是则return true,则完成表单提交,实现同步加载。

二、ajax异步加载

<pre name="code" class="html">1、
function post_message1(){
<span style="white-space:pre">	</span>//alert('success')
<span style="white-space:pre">	</span>data={'type':"2",'ip':'127.0.0.1'};
<span style="white-space:pre">	</span>$.post($(this).attr('action'), data, function(data,status,xhr){		
<span style="white-space:pre">	</span>	if(status=="success"){
		<span style="white-space:pre">	</span>change();
	<span style="white-space:pre">	</span>}
<span style="white-space:pre">	</span>});
}
2、
<pre name="code" class="html">function post_message2(){


<span style="white-space:pre">	</span>$.getJSON("yoururl",function(data){<span style="white-space:pre">	</span>
<span style="white-space:pre">		</span>dosomething();
<span style="white-space:pre">	</span>});
}


解释:

1、当调用post_message()函数时,发送data数据到服务器,当成功返回时,再调用change()函数。

2、当调用post_message()函数时,访问url为yoururl的链接,返回含有data数据的response,然后调用dosomething()函数。

三、刷新当前页面

window.location.reload();
四、定时执行某些特定操作,譬如更新图

$(function () {		
		window.setInterval('hostusage()', 2000);
	});
解释:两秒调用hostusage()函数一次


html与javascript之网络篇

标签:表单   ajax   异步加载   同步加载   javascript   

原文地址:http://blog.csdn.net/gugugujiawei/article/details/42171085

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!