处理ajax返回的js代码

1.====普通方式 调用 ajax处理 返回 的 responseText=======================》

 

//下面主要是对 返回 responseText 进行分析 :

 

                //方法1, 如果responseText是没有script标签的,并且是纯JS 代码,可以eval 方法执行
                //eval(XMLHTTPRequest.responseText);


                // 方法2 ,创建script对象 ,修改text属性的值
                 var script_obj=document.createElement("script");
                 script_obj.text = XMLHTTPRequest.responseText;

                //追加对象到body中

                 document.body.appendChild(script_obj);

 

               //  或者下面的 追加到head中

               document.getElementsByTagName("head")[0].appendChild(script_obj);

 

              由于对JS 在dom中执行 加载的顺序 不是很清楚 所以 需要学习

 

2.===============================================================》

---------------------------------->

//①下面贴出 简单的jquery的ajax处理JS 设置 dataType 类型为script ,自动执行JS脚本

 

 

$(document).ready(function() {
       
     $("#company").focus();
	 $("#company").mouseup(function() {
		$.ajax({
               type: "POST",
               url: "checkCompanyExist.action",
               data: "companyName="+$("#company").val(),
               async: false,
                //关键地方
                dataType: "script"
         }); 
	});
});

 

//页面:

<input name="companyName" id="company" type="text" />
						<span id="msg1" style="color:red "></span>
 

 

//上面的大致意思就是 获取 company文本输入框的 mouseup事件

//通过ajax调用 后台 action ,我的后台是 struts2 action

// 调用成功 action返回一个jsp页面 如下,

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
var divInnerHTML = '${msg}';

$("#msg1").html(divInnerHTML);
 

jquery的ajax调用 说明 jquery 对ajax的封装还是 比较简单的!因为我是新手

 

-------------------------------------->

// ②使用这个 $.get()调用ajax    ,处理结果 . 直接执行JS

 

 $(document).ready(function() {
       
     $("#company").focus();
	 $("#company").mouseup(function() {
		$.get("checkCompanyExist.action?companyName="+$("#company").val(), function(data){
            eval(data);
      });
	});
});

 

-------------------------------------->

// ③ 对返回的结果进行处理,直接执行JS

//用  $.ajax还有个好处就是 在向 后台 参数的时候不会有乱码问题

 

 $(document).ready(function() {
     $("#company").focus();
	 $("#company").mouseup(function() {
		$.ajax({
               type: "POST",
               url: "checkCompanyExist.action",
               data: "companyName="+$("#company").val(),
               async: false,
               success: function(msg){
                  eval(msg);
                }
         }); 
	});
});

 

 

//做点有用的东西

//下面是修改(copy) 好友的 天气预报 

$(document).ready(function() {
	$("#search").click(function() {
		$.ajax({
               type: "GET",
               url:  "http://www.google.cn/search",
               data: "hl=zh-CN9&btnG=Google+%E6%90%9C%E7%B4%A2&meta=&aq=f&oq=&q=tq",
                async: false,
                success: function(msg){
                var data = msg;
				var begin = data.indexOf("添加到 iGoogle");
				var end = data.indexOf("北京市专业气象台");
				var weather = data.substring(begin+29 ,end-35 );
				var s=weather.split("/images");
				for(var i=0;i<s.length;i++){
					s[i]=s[i]+"http://www.google.cn/images";
				}
				var xs=s.join("");
				$("#wea").html(xs);
				
                }
         }); 

	});
});

 //HTML页面

 

<input  type="button" value="天气查询" id="search"></input>
  <div id="wea"></div>

 代码 打包

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值