dojo contentPane,我张贴html代码与href在我的contentPane.html代码有一个脚本,但不

dojo contentPane, I post html code with href in my ContentPane. The html code has a script but does not work, why?

本文关键字:html 代码 contentPane 我的 有一个 脚本 但不 href 张贴 dojo      更新时间:2023-09-26

我在我的应用程序中使用dojo 1.9。我张贴html代码与href在我的ContentPane。html代码有一个脚本,但不能工作。

index . html代码:

<html>
<head>
  <meta charset="utf-8">   
  <link rel="stylesheet" href="css/claro.css">  
  <script>  dojoConfig = {parseOnLoad: true}    </script>   
  <script>
     require(
    ["dojo/parser", "dijit/layout/BorderContainer", "dijit/layout/TabContainer", "dijit/layout/AccordionContainer", "dijit/layout/ContentPane", "dijit/layout/AccordionPane","dijit/form/Button"]
      );
  </script>
</head>
<body class="claro">
  <script src="dojo/dojo.js"></script>
  <div data-dojo-type="dijit/layout/BorderContainer" style="width: 100%;height: 100%;position: absolute;z-index:1" id="main">
  <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" >
    <img src="ds.png" alt="ds" style="float: left; margin-right: 50px;"> 
    <img src="user.png" alt="ds" style="float: right;  height: 90px;">
    <div style="float: right;margin-right: 10px;">      
        <div id="loginName">    </div>
        <div id="email"></div>      
    </div>      
  </div>
<div data-dojo-type="dijit/layout/AccordionContainer" data-dojo-props="region:'leading'">
    <div data-dojo-type="dijit/layout/AccordionPane" title="pane #1"> panel #1</div>
    <div data-dojo-type="dijit/layout/AccordionPane" title="pane #2"> panel #2</div>
    <div data-dojo-type="dijit/layout/AccordionPane" title="pane #3"> panel #3</div>
</div>
<div data-dojo-type="dijit/layout/TabContainer" data-dojo-props="region:'center'">
    <div data-dojo-type="dijit/layout/ContentPane" title="tab #1" >panel #1</div>
    <div data-dojo-type="dijit/layout/ContentPane" title="tab #2" href="app/view/second.html"></div>
    <div data-dojo-type="dijit/layout/ContentPane" title="tab #3" href="app/view/third.html"></div>
</div>
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'">Footer</div>
</div>
</body>
</html>

app/view/third.html代码:

<button  type="button"  id="bpru">Click me!</button>
<div id="pp"></div>
<script>    
      on(dom.byId("bpru"), "click", function(){
           domConst.place("<bold>hello!!!</bold>", "pp");
      });
</script>

为什么不使用脚本代码?

这是因为它选择不以这种方式工作。使用JavaScript,您可以轻松地检索外部内容,但是当您加载外部内容时,脚本是而不是解释的。

如果您想这样做,您必须在您的内容上使用eval()函数来评估页面上的脚本。然而,这通常被认为是一个不好的做法,因为如果没有正确实现,它可能会给你的网站带来一些注入漏洞。在这个回答中阅读更多关于它的信息,它涵盖了为什么它被认为是一个不好的实践的所有原因。

如果您仍然希望在远程页面上执行脚本,那么使用dojox/layout/ContentPane模块。这个模块与dijit/layout/ContentPane非常相似,但是它有一个名为executeScripts的属性,允许您执行远程脚本。

所以你的HTML代码(index.html)可能包含如下内容:
<div data-dojo-type="dojox/layout/ContentPane" title="tab #3" data-dojo-props="href: 'app/view/third.html', executeScripts: true"></div>

*小注意:我还将您的href转换为data-dojo-props替代品。你不必这样做,但据我所知,href不是<div>元素的合适属性,所以这个HTML更有效。