跳至內容
MasterDragon
使用者工具
登入
網站工具
搜尋
工具
顯示頁面
舊版
反向連結
最近更新
多媒體管理器
網站地圖
登入
>
最近更新
多媒體管理器
網站地圖
足跡:
program:javascript:解決ajax叫javascript的問題
本頁是唯讀的,您可以看到原始碼,但不能更動它。您如果覺得它不應被鎖上,請詢問管理員。
===== 解决ajax返回innerHTML中javascript不能运行问题 ===== [[http://209.85.173.132/search?q=cache:ZJIRmrzZ53UJ:blog.csdn.net/yehell/archive/2008/03/31/2232326.aspx+%E8%A7%A3%E5%86%B3ajax%E8%BF%94%E5%9B%9EinnerHTML%E4%B8%ADjavascript%E4%B8%8D%E8%83%BD%E8%BF%90%E8%A1%8C%E9%97%AE%E9%A2%98&hl=zh-TW&ct=clnk&cd=2&gl=tw|來源]] 在实际应用的过程中,我们经常会遇到使用ajax返回某一个网页的内容到模版页面的某一个<div>标签中显示的操作。如果返回的值仅仅是文本类数据不会影响模版页面的功能,但是如果返回的数据包括javascript,那么直接innerHTML到模版页的这段脚本是不会被运行的。原因在于浏览器只在显示模版时才解析javascript,而使用ajax返回的js是被后期倒入的并没有被解析,所以调用的时候找不到对应的function()。 想要解决这个问题,最基本的方法就是需要让浏览器可以同时解析<div>标签中的js。如果单适用IE浏览器,最简单的方式就是在<div>中的<script>标签中添加属性defer,它可以通知IE该脚本需要异步解析。但是令人头痛的是Firfox的标准总是和IE有着各种各样的不同,由于FF不支持defer所以使得开发者不得不另辟蹊径来解决这个问题。 实际上,我们可以在ajax返回数据并innerHTML到模版之前先把<div>中的javascript取出并写到模版页面的<head>中让浏览器解析。这样就相当于在打开模版页面的同时加载了所有<div>标签需要的javascript。奇怪的是这些脚本必须添加在<head>标签中FF才能有效,如果有人知道原因希望可以指点偶一下。 实现方法举例: <code javascript> function get_div_content(divid){ var xmlHttp = GetXmlHttpObject(); var url = "http://" + document.location.host + "/divpage.jsp?id="+divid+"&random="+Math.random(); var div_content_id = "drag_content_"+divid; var xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("AJAX初期化失敗!"); return; } xmlHttp.onreadystatechange=function(){ if(xmlHttp.readyState < 4){ document.getElementById(div_content_id).innerHTML="Loading..."; } if(xmlHttp.readyState==4){ //用正则表达式匹配ajax返回的text中是否有onload,如果存在则取出内容。 var reg_onload = /<body onLoad="([^<]*)">/; var match_onload=xmlHttp.responseText.match(reg_onload); //用正则表达式匹配ajax返回的text中是否有<script>,如果存在则取出标签内部的内容。 var reg = /<script[^>]*>([sS]*)</script>/; var match=xmlHttp.responseText.match(reg); var MyScript=""; if(match!=null){ MyScript=match[1]; var script=document.createElement("script");//在模版页创建新的<script>标签 script.text=MyScript;//给新的script标签赋值 document.getElementsByTagName("head")[0].appendChild(script);//把该标签加入<head> } var Html=xmlHttp.responseText.replace(reg,"");//将剩下的text祛除<script>部分,插入模版页 document.getElementById(div_content_id).innerHTML=Html; if(match_onload!=null){ eval(match_onload[1]);//如果存在onload方法,则调用; } } } xmlHttp.open("GET",url,true); xmlHttp.send(null); } </code> test.html <code> <table> <script type="text/javascript" defer="defer"> function test(){alert('测试下,用ajax的话,这段代码也会执行的!');} </script> <tbody> <tr> <td><input onclick="test()" value="click me" type="button"></td> </tr> </tbody> </table> </code>
program/javascript/解決ajax叫javascript的問題.txt
· 上一次變更: 2019/11/16 08:12 由
127.0.0.1
頁面工具
顯示頁面
舊版
反向連結
回到頁頂