网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的范文:

 

标题 jQuery之ajax实例
范文
    jquery第十九课,在前一课学习了jQuery的ajax参数的设置,本节直接通过实例来进行ajax的介绍,并分析ajax的参数设置等.
    参考共用代码:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML><HEAD><TITLE>jquery特效处理-前台代码</TITLE>
    <script language="javascript" src="jquery-1.4.2.min.js"></script>
    <SCRIPT language="javascript">
    $(function(){//<!--www.forasp.cn jquery代码区-->
    $("#cn").bind("click",function(){//绑定后面的按钮click事件
    //ajax代码区        
    });});
    </SCRIPT>
    <BODY>
    <input type="text" maxlength="20" id="forasp"> <input type="button"  value="jquery的ajax测试" id="cn">
    </BODY>
    </HTML>
    (1)用GET的提交形式ajax实例分析
    $.ajax({type:"GET",dataType:"text",data:"foraspcnurl="+$("#forasp").val(),url:"index.php",success:function(msg){alert(msg);}
    index.php代码如下
    <?echo $_GET["foraspcnurl"];?>
    分析:提交方式type:GET,数据类型data:text,数据foraspcnurl=id为forasp的text的值,发送请求地址url:index.php,成功返回success函数:function(msg){},msg为返回的数据
    运行:在文本框填写"网站制作学习网",点击按钮弹出"网站制作学习网"
    (2)用POST提交形式提交ajax实例
    $.ajax({type:"POST",catch:false,dataType:"text",data:"foraspcnurl="+$("#forasp").val(),url:"index4.php",success:function(msg){alert(msg);}
    index.php代码如下
    <?echo $_POST["foraspcnurl"];?>
    分析:基本跟GET方式相似,多了个是否缓存catch:false,不缓存该页面.加这个cache更明白cache用法.在请求的url代码不一样了由原来的$_GET变成了$_POST这事根据提交形式来定的.
    (3)通过ajax看参数context(类型object),dataType(数据类型string),beforeSend的使用
    $.ajax({
    type:"POST",
    cache:false,dataType:"text",
    data:"foraspcnurl="+$("#forasp").val(),
    url:"index4.php",
    success:function(msg){alert(msg);},
    complete:function(){alert("完成ajax事件")},
    beforeSend:function(){return confirm("检查数据,确实提交吗?");}
    });
    运行试试,首先用beforeSend,弹出"检查数据,确实提交吗?",如果点击确定返回true,则继续ajax,如果不是,则停止执行ajax,当确定后则执行,首先弹出输入的内容,然后弹出ajax执行完成.
    先介绍这三个,明天继续介绍
随便看

 

在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/15 15:38:54