ajax可通过直接写源码实现,但有点繁琐,现在流行的ajax框架都集成了ajax的功能,而且写起来非常简单方便。当然mootools也不例外。mootools是一个非常优秀的javascript的库,有些地方跟prototype颇有相似(指按面向对象做js)。mootools的Request实现了对XMLHttpRequest的功能包装类,下面是我写的一个小示例:

function scoring(score){
//var url = document.getElementById("url").value;
var url = 'test';
var pingRequest = new Request({
method: "post",
url: "http://www.nowamagic.net/librarys/veda/",
data: score,
onSuccess: function(responseText){
if(responseText=="success"){
//alert(responseText);
}
else{
//alert(responseText);
}
},
onFailure: function(){
//alert(responseText);
}
});
pingRequest.send("url="+ url +"&score=" + score + "&id=" + id);
}

在后台可以使用$_POST[]来获得ajax传过来的数据。

ajax类的使用:

var ajax = new Ajax(url, options);
ajax.request();

url是提交到后台处理的路径。options有2个经常使用的参数:{onComplete:handleFun,data:postArgs}

function handleFun(req){
alert(req);
}

onComplete参数指向处理返回的文本函数;data(老版本用postBody名)是按doPost方式提交的字符串。

下面用ajax的2种方法提交form表单(相当于点击form中的submit按钮):

<form action="test.php" id="form1">
<input name="user_name" />
<input name="user_id" />
<input type="button" onclick="ajaxSubmit();" />
</form>

方法1:

function ajaxSubmit(){
var postArgs = $('form1').toQueryString();
new Ajax('test.php',
{data:postArgs,onComplete:handleFun}).request();
}

方法2:

function ajaxSubmit(){
var postArgs = $('form1').toQueryString();
$('form1').send({onComplete:showResponse,data:postArgs});
}

$()函数相当于js的document.getElementById(),toQueryString()函数是得到form中提交元素的字符串。

用例1时无需在form中指定action,而必须指定Ajax中的url,例2则必须指定form中action,而无需指定Ajax中的url,另外在 test.php 中接受参数一律用 $_POST[''] 接受即可。

下面再来几个示例:

示例一

<script type="text/javascript">
window.addEvent("domready",function(){
$("send").addEvent("click",function(){
var url="nowamagic.php?areaid="+$("areaidvalue").value+"&say="+escape($("say").value);
// escape()是处理编码函数,没有它传替中文时会出乱码
new Ajax(url,{method:'post',onComplete:function(){
$("Content").innerHTML=this.response.text;
alert('发表成功!');
}}).request();
});
});
</script>

示例二

<script type="text/javascript">
window.addEvent("domready",function(){
$('btnSent').addEvent('click',function(){
if($('txtContent').innerText==''){
alert('发送内容不能空!');
return;
}
var url='Default2.aspx';
var postData=$("postMessage").toQueryString();
new Ajax(url,{method:'post',onComplete:function(){
$('messageBox').innerHTML += this.response.text;
}
}).request(postData);
});
});
</script>

示例三

	<script type="text/javascript">
window.addEvent("domready",function(){
$('myForm').addEvent('submit', function(e) {
new Event(e).stop();
if($("message").value==""){
alert('请输入要发送的消息');
return;
}
this.send({
onComplete: function() {
var request=Json.evaluate(this.response.text);
$("messagebox").innerHTML=request.msg;
$("namebox").innerHTML=request.name;
alert('发送成功!');
}
});
}); });
</script>

mootools框架里如何使用ajax的更多相关文章

  1. "Timeout"在测试框架里是如何被实现的

    今天组里的小伙伴问了我一个问题:“我这里有一个底层驱动的接口,我想在测试它的时候加上超时限制,时间一过就fail掉它,执行后面的测试用例.怎么办到呢?”.我问:“它自己没有超时响应的机制么? 超时抛e ...

  2. struts2框架通过jQuery实现AJAX应用

    众所周知,在web2.0时代,哪个web框架要是不跟AJAX沾点边,都不好意思说自己的框架有多么多么NB,当然struts也不例外,从 struts1开始到现在的struts2也都对AJAX有支持.A ...

  3. javascript之复习(框架里的方法们)

    继上次整理,一些东西没有整理完.就写在这.可能比较乱比较杂,因为都是整理的一些东西,也没有到做成专题的程度. 1.String.repeat() 大家要实现重复一个字符串的重复怎么写呢,反正我的第一想 ...

  4. 将dubbo框架里的服务提供者迁移进k8s里,以docker提供服务时要注意的细节

    在将dubbo框架里的服务提供者迁移进k8s时,有几个注意事项: 1, 要为默认情况下,dubbo会将k8s里的pod ip地址作为注册服务的地址,所以这个地址需要被改写(ip测试过,行得通,而dns ...

  5. unittest框架里的常用断言方法:用于检查数据

    1.unittest框架里的常用断言方法:用于检查数据. (1)assertEqual(x,y) 检查两个参数类型相同并且值相等.(2)assertTrue(x) 检查唯一的参数值等于True(3)a ...

  6. 虚拟DOM解析及其在框架里的应用

    虚拟DOM解析及其在框架里的应用 浏览器是怎样解析HTML并且绘出整个页面的 上图为webkit引擎浏览器的处理流程,如上图大致分为4大步: 第一步,HTML解析器分析html,构建一颗DOM树: 第 ...

  7. easyUi 学习笔记 (二 ) 使用tabs 里datagridview 发送ajax请求 不访问后台的问题

    这个BUG 我花了一个半小时, 还是看不出哪里的问题,  于是就百度到这么一段话,我需要记住 <================================================= ...

  8. [麦先生]在Laravel框架里实现邮箱验证---发送邮件

    在经过一段时间的使用后,发现在项目中很多地方需要用到用户验证,以短信验证和邮箱验证为主流趋势,小麦总结了如果在Laravel框架中实现发送邮件功能,以后会陆续更上如何实现短信验证..... 在.env ...

  9. 简单实用后台任务执行框架(Struts2+Spring+AJAX前端web界面可以获取进度)

    使用场景: 在平常web开发过程中,有时操作员要做一个后台会运行很长时间的任务(如上传一个大文件到后台处理),而此时前台页面仍需要给用户及时的进度信息反馈,同时还要避免前台页面超时. 框架介绍: 本架 ...

随机推荐

  1. Python特别low的一个文字游戏

    闲来无事 ,调侃舍友的游戏 import os class Role(): def __init__(self,name,sex,fighting): self.name=name self.sex= ...

  2. zabbix配置报警媒介-用户-动作-邮件脚本触发mailx邮件报警

    2018-09-16更新,新版本zabbix不需要使用脚本发送邮件,在zabbix web界面直接配置就可以 配置邮件参数,测试发送邮件 确认安装相关服务,centos7默认安装 [root@VM_1 ...

  3. Mult

    public class MULT { public static void main(String args[]) { int k; for(int x=1;x<=9;x++) { for(i ...

  4. UVA11988 Broken Keyboard (a.k.a. Beiju Text)【数组模拟链表】

    参考:https://blog.csdn.net/lianai911/article/details/41831645 #include <iostream> #include <c ...

  5. C#的特性Attribute

    一.什么是特性 特性是用于在运行时传递程序中各种元素(比如类.方法.结构.枚举.组件等)的行为信息的声明性标签,这个标签可以有多个.您可以通过使用特性向程序添加声明性信息.一个声明性标签是通过放置在它 ...

  6. 纯js实现复制内容到剪切板

    下面的方法可以完美实现: 复制指定input 或者 textarea中的内容: 指定非输入框元素中的内容 代码如下: function copyToClipboard(elem) { // creat ...

  7. C++11中decltype的使用

    The decltype type specifier yields the type of a specified expression. The decltype type specifier, ...

  8. qt 编译unresolved external symbol的错误解决

    题外问题:.rc文件报错,里面引用的.h文件打不开. 方法:rc文件移除,然后重新添加就可以: unresolved external symbol的原因: 1.没有添加编译生成的moc文件,添加对应 ...

  9. Qt_C++交换两个数

    在编程过程中,交换两个数是我用常用的 ,这里做下简单的搬运 bool Widget::swap(int a, int b) { int temp =a; a= b; b = temp; } 这种方式其 ...

  10. 今日Linux

    一.复习了vi 三个模式下的一些操作.贴上一些比较常用,个人觉得比较难记的操作.1.一般模式:h  光标向左移动一个字符j   光标向下移动一个字符K  光标向上移动一个字符l    光标向右移动一个 ...