我有两个以这种方式定义的表单
Home.jsp:-
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
@import "../Script/dojo-1.10/dijit/themes/claro/claro.css";
</style>
<script type="text/javascript">
dojoConfig = {
isDebug: true,
parseOnLoad : true
}
</script>
<script type="text/javascript" lang="JavaScript" src="../Script/dojo-1.10/dojo/dojo.js"></script>
<script type="text/javascript">
require(["dojo/parser","dijit/form/Button",
"dojo/domReady!"],function(parser){
//parser.parse();
alert("From Require");
});
function getWelcomeJsp(){
var loadResponse = dojo.byId("loadResponse");
dojo.xhrPost({
url:"Welcome.jsp",
handleAs:"text",
load:function(data){
dojo.style(loadResponse,"display","block");
loadResponse.innerHTML = data;
return data;
},
error:function(err){
alert("error"+err);
}
});
}
</script>
</head>
<body class="claro">
<table>
<tr><td valign="bottom">
<a href="Welcome.jsp">This Is Hyperlink</a>
</td></tr>
<tr>
<td>
<label for="empId">EmpId:</label>
<input id="empId" data-dojo-type="dijit/formTextBox"
type="text"/>
</td></tr><tr><td>
<button data-dojo-type="dijit/form/Button" id="buttonId" onclick="getWelcomeJsp();">Send</button>
</td></tr></table>
<div id="loadResponse"></div>
</body></html>
Welcome.jsp:-
<!DOCTYPE html>
<html><head>
<style type="text/css">
@import "../Script/dojo-1.10/dijit/themes/claro /claro.css";</style>
<script type="text/javascript" lang="JavaScript" src="../Script/dojo-1.10/dojo/dojo.js"> </script>
<script type="text/javascript" lang="JavaScript">
require(["dojo/parser","dojo/ready"],function(parser,ready){
dojo.ready(function(){
parser.parse();
alert("From Ready");
});
});
function myfunction(){
alert("from welcomedd JSP");
}
</script></head>
<body class="claro" onload="myfunction();">
This Is Welcome JSP
<button id="responseButton" data-dojo-type="dijit/form /Button" onclick="myfunction();">Response Button</button>
</body></html>
是的,当我使用dojo 1.9版本点击Home.jsp中的超链接时,Welcome.jsp会被很好地填充,Welcome.jsp中的ready函数也会被调用,并且所有dojo小部件都会被编译。
当我尝试通过 Home.jsp 的 ajax 调用加载 Welcome.jsp 时,出现了问题。
Welcome.jsp 正在加载,但 Welcome.jsp 中的就绪函数和 onload 函数没有被调用,这可能是 ajax 响应中的问题。 我只是无法理解这里面临的问题,请让我知道任何解决方案。
最佳答案
出于安全原因,当您使用 AJAX 添加脚本并将内容设置为内部 HTML 时,Web 浏览器不会评估脚本。
您有几个选项可以解决这个问题:
如果您只需要加载一些小部件,则可以使用
dijit/layout/ContentPane
小部件并设置href
属性。这将使用 AJAX 检索内容并自动解析所有小部件。如果您确实想在页面上执行脚本,则必须使用
eval()
,请查看此答案以获取更多信息:Can scripts be inserted with innerHTML?
它实际上意味着您必须循环遍历动态内容上的所有脚本并对它们使用eval()
在页面上执行脚本并解析其中的所有小部件的更简单方法是查看
dojox/layout/ContentPane
模块。它的工作原理与 dijit/layout/ContentPane 模块类似,但有一点不同:它添加了一个属性executeScripts
,您可以使用它来评估页面上的脚本。例如:
<div id="loadResponse" data-dojo-type="dojox/layout/ContentPane"
data-dojo-props="href: 'welcome.jsp', executeScripts: true"></div>
关于javascript - ajax 响应中未调用 Dojo 就绪函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24796464/