Question

我有两种以这种方式定义的形式

回到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中的ready函数和onload函数没有被调用，这可能是ajax响应中的问题。我只是无法理解这里面临的问题，请让我知道任何解决方案。

Answer 1

出于安全原因，当您使用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>

Answer 2

我有另一个解决方案来解决这个问题。

最初删除welcome.jsp和body标签中的所有脚本，css相关代码
在getWelcomeJsp（）函数中，在通过innerHML将数据设置为div之后，调用parser.parse（）;并在require中编写welcome.jsp中使用的所有组件。

如果你想调用任何类似keyup的事件，请点击..........使用此代码

 on(domNode,"click",function(event){
//logic to implement
});

在parser.parse（）;

在ajax响应中没有调用Dojo就绪函数

2 个答案: