前端之家收集整理的这篇文章主要介绍了
ajax自己的例程，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
<html> <head> <title>jQuery Ajax 实例演示</title> </head> <script type="text/javascript"> $(document).ready(function(){//这个就是jQueryready ，它就像C语言的main 所有操作包含在它里面 //$.get()方式： $('#test_get').mousedown(function () { var url = '@{Application.test()}'; $.get(url,{'str':$("#username").val()},function(data){ alert("name:" + data);$('#result').html("get姓名:" + data);},'text'); }); //$.post()方式： $('#test_post').mousedown(function (){ $.post( '@{Application.test()}',{'str':$('#username').val()},function (data) //回传
函数 { $('#result').html("姓名1:" + data); },'text'); }); //ajax方式 $("#button_login").mousedown(function(){ login(); //点击ID为"button_login"的按钮后触发
函数 login(); }); }); function login(){ //
函数 login(); var username = $("#username").val();//取框中的
用户名 var password = $("#password").val();//取框中的密码 var s=username+password; $.ajax({ //一个Ajax过程 type: "post",//以post方式与
后台沟通 url : "../Application/test",//与test()沟通 data: 'str=' + s,//发给test()的数据 dataType:'text',//从test()回的值以 JSON方式 解释 success: function(json){//如果
调用test()成功 if (json == "") { $('#result').html("姓名:"); } alert("name:" + json); $('#result').html("姓名:" + json); //把
PHP中的返回值
显示在预定义的result定位符位置 } }); } </script> <body> <div id="result" style="background:orange;border:1px solid red;width:300px;height:200px;"></div> <form id="formtest" action="@{Application.test()}" method="post"> <p><span>输入姓名:</span><input type="text" name="username" id="username" /></p> <p><span>输入密码:</span><input type="text" name="password" id="password" /></p> </form> <button id="button_login">ajax提交</button> <button id="test_post">post提交</button> <button id="test_get">get提交</button> </body> </html>
原文链接：https://www.f2er.com/ajax/164847.html
