GVKun编程网logo

ECSHOP中ajax的调用原理（ajaxcss）

12

最近很多小伙伴都在问ECSHOP中ajax的调用原理和ajaxcss这两个问题，那么本篇文章就来给大家详细解答一下，同时本文还将给你拓展ajax-ecshop手机端省市联动bug、Ajax——jq中a

最近很多小伙伴都在问ECSHOP中ajax的调用原理和ajaxcss这两个问题，那么本篇文章就来给大家详细解答一下，同时本文还将给你拓展ajax-ecshop手机端省市联动bug、Ajax——jq中ajax的使用、ajax使用总结-ajax的配置-ajax的调用-ajax的中文乱码-ajax的表单提交、AJAX没有反应 谁说AJAX的调试不需要服务器来着！等相关知识，下面开始了哦！

本文目录一览：

ECSHOP中ajax的调用原理（ajaxcss）

ECSHOP中ajax的调用原理（ajaxcss）

AJAX 在很多网站项目中都有利用到， ECSHOP 也不例外

下面就来为大家讲一讲ecshop中ajax的调用原理。

1、首先ecshop是如何定义ajax对象的。

ecshop中的ajax对象是在js/transport.js文件中定义的。里面是ajax对象文件。声明了一个var Ajax = Transport;对象和一个方法Ajax.call = Transport.run;


2、ecshop中ajax可以使用两种方式传递数据．一种是get方式，一种是post方式.


Ajax.call( 'user.PHP?act=is_registered','username=' + username,registed_callback,'GET','TEXT',true,true );

Ajax.call('user.PHP?act=return_to_cart','order_id=' + orderId,returnToCartResponse,'POST','JSON');



3、ecshop中的　ajax可以是传递text数据，也可以是一个json对象。比如以下代码

goods.quick = quick;
goods.spec = spec_arr;
goods.goods_id = goodsId;
goods.number = number;
goods.parent = (typeof(parentId) == "undefined") ? 0 : parseInt(parentId);

Ajax.call('flow.PHP?step=add_to_cart','goods=' + goods.toJSONString(),addToCartResponse,'JSON');

里面的goods就是对象．而且是靠json来传递的。返回的结果result也是对象．



4、ecshop ajax函数里面．第三个参数就是回掉函数的名称。


比如以上代码addToCartResponse　这个函数就是ajax处理结果的回调函数．



5、在ecshop的PHP代码中，一般是通过get或者post方式来接受函数。


比如以下例子,如果接受的是对象。还需要用json数据格式来处理．


include_once('includes/cls_json.PHP');


$_POST['goods'] = json_str_iconv($_POST['goods']);


处理的返回结果，也需要是json格式发送给js


die($json->encode($result));

以上就为大家简单的介绍了ecshop中ajax的调用原理与调用方法，当然这些只是最基础的东西，还需要大家在以后的应用中逐渐领会。

ajax-ecshop手机端省市联动bug

ajax-ecshop手机端省市联动bug

ajaxphp手机

/*ajax获取区域信息*/
if($act == ''ajax_get_region'')
{
$region_id = intval($_get[''region_id'']);
$type = intval($_get[''type'']);
$region = get_regions($type, $region_id);
//print_r($region);
$html = $onclick = '''';
switch ($type){
case ''1'': $onclick = ''province''; break;
case ''2'': $onclick = ''city''; break;
case ''3'': $onclick = ''area''; break;
}
if($region){
foreach ($region as $v){
$html.="{$v[''region_name'']}";
}
}
echo $html;
exit;

}

第二次点击修改地址是，就出现这样的bug,求大神怎么破

Ajax——jq中ajax的使用

Ajax——jq中ajax的使用

格式化表单

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.js"></script>
</head>
<body>
<form action="11.php" method="get" id="form">
    <input type="text" name="text" value="wq"><br>
    <input type="text" name="pwd" value="123"><br>
    <input type="text" name="sex" value="nv">
</form>
<script>
    $(function () {
        var a = $(''#form'').serialize();
        console.log(a);//text=wq&pwd=123&sex=nv
        $.get(''11.php'', a, function (data) {
            console.log(data);//wq
        });
    });
</script>
</body>
</html>

 

<?php
  header("content-type:text/html;charset=utf-8");
  echo $_GET[''text''];
?>

异步提交

1、参数的顺序要正确：url、data、success、dataType

2、最后一个dataType可以不写，如果写了json，那么返回的数据会自动进行js对象的转化JSON_parse()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.js"></script>
</head>
<body>
<button>get异步</button>
<button>post异步</button>
<script>
    $(function () {
        $(''button:eq(0)'').on(''click'',function () {
            $.get(''12.php'',{name:''wq'',age:12},function (data) {
                console.log(data);//wq==12
            })
        });
        $(''button:eq(1)'').on(''click'',function () {
            $.post(''13.php'',{name:''qx'',age:14},function (data) {
                console.log(data);//qx===14
            })
        });
    });
</script>
</body>
</html>
<?php
  header("content-type:text/html;charset=utf-8");
  echo $_GET[''name''].''==''.$_GET[''age''];
?>
<?php
  header("content-type:text/html;charset=utf-8");
  echo $_POST[''name''].''===''.$_POST[''age''];
?>

ajax综合

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.js"></script>
</head>
<body>
<button>ajax异步</button>
<script>
    $(function () {
        $(''button:eq(0)'').on(''click'',function () {
            $.ajax({
                url:''13.php'',
                data:{name:"qx",age:17},
                success:function (data) {
                    console.log(data);//qx===17
                },
                type:''post'',
                beforeSend:function () {
                    console.log(''发送之前调用'');
                },
                error:function () {
                    console.log(''数据接收错误'');
                }
            });
        });
    });
</script>
</body>
</html>
<?php
  header("content-type:text/html;charset=utf-8");
  echo $_POST[''name''].''===''.$_POST[''age''];
?>

 

ajax使用总结-ajax的配置-ajax的调用-ajax的中文乱码-ajax的表单提交

ajax使用总结-ajax的配置-ajax的调用-ajax的中文乱码-ajax的表单提交


·jquery的使用 0、必须优先引入jquery.js 否则无法调用jquery框架 1、js区分大小写，起名字的时候要注意 2、jquery根据div的id属性获取页面text的值：$("#demoID").val()，根据class属性获取页面text的值$(".demoCLASS").val(),如果是赋值$("#demoID").val("赋值的参数") 3、$(document).ready(function(){代码})、$().ready(function(){代码})、$(function(){代码})的含义一样 4、多个$(function(){代码})可以并存，即只要名字不重复可以同时发挥作用 5、$(function(){代码})的意思是页面加载完毕即运行，比如自动点击，自动弹框，再或者点击监听或者其他监听 6、加载完即点击和“点击的监听”的区别（非常有借鉴意义） 比如现在有一个js方法，function demoFunction(){alert("这个方法运行了");}; 加载完即点击：$("#demoid").click(demoFunction()); 加载完后即监听，这个方法只能是在按钮有click这个动作，或者通过jquery有click()动作：$("#demoid").click(function(){demoFunction()}); 7、如果是自动加载即运行的，或者需要被监听的都需要放置到$(document).ready(function(){代码})的代码中 8、window.onload=function(){代码}与$(function(){代码})的区别 ·调用函数的用法不同： window.onload = function(){代码}; $(function(){代码}) ·调用函数的时间不同 window.load=function(){代码}：必须等待网页中所有的内容加载完毕（包括图片）才能执行，比如要运用上传等功能。 $(function(){代码})，等到网页中所有的DOM结构绘制完毕后就可以执行。 9、AJAX专题 ·需要的jar包：commons-lang-2.5.jar、commons-lang3-3.1.jar、javassist-3.11.0.GA.jar ·前台js的写法：为了简化流程，写成页面加载即运行 $(document).ready(function(){ $.ajax({ url : "testajax.do",// 请求地址 //timeout : 600000,//超时时间设置，单位毫秒 async : false,// 异步 cache : false,// 缓存 type : 'post',// 请求方式 data: {"name":"123"},//data: $('#formid').serialize(),//序列化表单-当触发一个form表单提交的ajax事件的时候，这个序列化方法自动将数据转化围殴json格式传递给后台 dataType : 'json',// 服务器返回的数据类型 success : function(msg) {// 请求成功后调用的 alert("返回json的实验成功了"+" msg.resultcode="+msg.resultcode+" msg.name="+msg.name); },error :function(){ alert("异常"); } }); }); ·struts.xml文件的写法 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts-2.3.dtd"> <struts> <!--略去一些struts2的配置信息--> <package name="myajax" extends="json-default" namespace="/"> <global-results> <result name="message" type="json"> <param name="root">message</param> </result> </global-results> <action name="*"method="{1}"> <result name="list">/index.jsp</result> </action> </package> <!-- 包含的其他配置文件 --> <include file="struts-method.xml"></include> </struts> ·后台java代码：仅距离调用ajax，故不涉及数据库操作 import java.io.IOException; import java.io.PrintWriter; import java.util.HashMap; import java.util.Map; import javax.servlet.http.HttpServletResponse; import org.apache.struts2.ServletActionContext; public class AjaxTest { protected Map<String,Object> message = new HashMap<String,Object>(); /** AJAX请求返回RESULT的name常量*/ protected final static String MESSAGE = "message"; public Map<String,Object> getMessage() { return message; } public void setMessage(Map<String,Object> message) { this.message = message; } //-登录页面中form表单提交的路径 public String testajax() throws IOException{ System.out.println("获取参数name="+ServletActionContext.getRequest().getParameter("name")); message.put("resultcode","0000"); message.put("resultcode","0001"); message.put("name","zhong文ce试"); return MESSAGE; } } ·ajax的应用之提交form表单数据-表单数据自动转json格式 场景描述：当具体的提交信息为一个form表单，并通过ajax传递给后台时，我们通常使用一个叫序列化的方法将这个form表单转化为json格式传递给后台。 ·form表单的格式，form标签有id，input标签有name <form id="formid"> 姓名：<input type="text" name="name" value="张三"/><br> 年龄：<input type="text" name="age" value="12"/><br> <input type="submit" value="提交" id="submitid"/> </form> ·js部分的代码-可以单独写在一个js文件，注意，需要先引入jquery.js文件 $(document).ready(function(){ $("#submitid").click(function(){ajaxhere()}); }); //提交表单的ajax function ajaxhere(){ $.ajax({ url : "testajax3.do",// 请求方式 data: $('#formid').serialize(),//序列化表单 dataType : 'json',// 服务器返回的数据类型 //contentType:"application/x-www-form-urlencoded; charset=utf-8",success : function(msg) {// 请求成功后调用的 alert("form表单触发的实验成功了"+" msg.resultcode"+msg.resultcode+" msg.name="+msg.name); },error :function(){ alert("异常"); } }); }; ·传统的ajax返回方式，即java部分的返回写在流里-特别要注意这里的处理中文乱码的解决方式 HttpServletResponse response = ServletActionContext.getResponse(); response.setCharacterEncoding("utf-8"); PrintWriter writer = response.getWriter(); String a = "{\"resultcode\":\"0000\",\"name\":\"文试\"}"; writer.write(a); writer.flush(); writer.close();

AJAX没有反应 谁说AJAX的调试不需要服务器来着！

AJAX没有反应 谁说AJAX的调试不需要服务器来着！

总结

以上是小编为你收集整理的AJAX没有反应 谁说AJAX的调试不需要服务器来着！全部内容。

如果觉得小编网站内容还不错，欢迎将小编网站推荐给好友。

今天关于ECSHOP中ajax的调用原理和ajaxcss的分享就到这里，希望大家有所收获，若想了解更多关于ajax-ecshop手机端省市联动bug、Ajax——jq中ajax的使用、ajax使用总结-ajax的配置-ajax的调用-ajax的中文乱码-ajax的表单提交、AJAX没有反应 谁说AJAX的调试不需要服务器来着！等相关知识，可以在本站进行查询。

本文标签：

上一篇AJAX简单实例（GET、POST）（ajax简单实例）

下一篇使用ajaxSubmit问题导致无法上传文件（ajax无法发送请求）

相关文章