基于 AJAX 的 Web 应用程序


AJAX based web application

无论可以编程哪种类型的Web应用程序,实现AJAX都会使程序 - 尽管可以说 - 更高效,更"漂亮"。

我目前正在开发一个具有完整用户界面的在线商店,其中包括:订单历史记录,愿望清单,推荐链接等。我们已经意识到,通过在 AJAX 中使许多用户操作可执行将更加用户友好,而不是例如,每次用户从愿望清单中删除产品时刷新页面。

遵循该逻辑将导致服务器上的/ajax 目录中有大量文件和长得离谱的.js文件。

我的问题是 - 在编写许多不同的 ajax 请求时是否有一定的标准或"技巧"?或者更好的是,有没有一种有效的方法来编写 AJAX 请求?

问候

创建一个 JS 文件并将该文件包含在所有页面中。在该JS文件中,创建一个具有3个参数的ajax函数。

参数 ajax 函数的值:

  1. 想要发送请求的页面网址
  2. 要发送的值的关联数组
  3. 元素 ID 想要填充来自 ajax 请求的响应。

从任何页面调用此函数,因此无需在每个页面中创建 ajax 函数。

希望它能有所帮助!

您所需要的只是一个发出所有数据请求的通用函数

此函数可以具有参数

  1. 要在发布请求中发送的对象(键,值)
  2. 返回请求时运行的函数

将键&datafunc=somefunctionname添加到请求字符串

在服务器端

如果$_POST包含密钥datafunc,则运行相应的php函数,该函数将返回所需的数据

$fun=$_POST['datafunc'];
$fun();

使用 jQuery.getJSON()jQuery.get() 来执行 ajax 调用。好吧,最后两者都被翻译成jQuery.ajax().

http://api.jquery.com/jQuery.ajax/

诀窍

是保持你的逻辑尽可能愚蠢,并有一个适当的DTO。现在将一个非常强大的Javascript View框架添加到组合中,你基本上完成了。

想象一下jQuery成功回调中的以下内容(没有MVC框架,您可以自己填充元素):

success: function(data, textStatus, jqXHR) {
    // data is the DTO as you defined it
    $ele = $(data.target);
    // and now update your target
    $ele.html(data.content);
}