在内容窗格中的html中加载javascript

我有一个html文件，我想从各种页面加载到dijit.contentpane。内容加载正常（我只是设置内容窗格的href），但问题是，由href指定的html文件内的JavaScript似乎并没有在一致的时间执行。在内容窗格中的html中加载javascript

这样做的最终目标是将HTML文件加载到文件中定位点的内容窗格中（即，如果您在index.html＃标记中键入以跳转到文件的某个部分）。我尝试了几种不同的方法，似乎无法获得任何工作。

我已经试过什么：

1. （指的的dijit.contentpane的href）

href="page.htm#anchor"

2. （同样，指的的dijit.contentpane的href - 真的没有想到这个工作，但决定尝试反正）

href="#anchor"

3（这最后尝试通过HREF指定的HTML内）

<script type="text/javascript"> 

    setTimeout("go_to_anchor();", 2000); 

    function go_to_anchor() 
    { 
     location.href = "#anchor"; 
    } 
</script>

这最后一次尝试是最接近他们所有的工作。 2秒后（我把延迟放在那里，看看dijit代码中的某些内容是否可能与我的javascript同时加载），我可以看到浏览器短暂地跳到html页面中的正确位置，但是立即返回到页面的顶部。

来源

2011-12-31 user1124421

你的Javascript在你的html页面的底部？ – 2011-12-31 15:48:19

它位于和之内，但位于页面的底部。 – user1124421 2011-12-31 16:13:53

这是否跨浏览器相同？任何输入的形式？其他可能会争取焦点的东西（） – rene 2011-12-31 19:37:52

Dojo在URL中使用散列值来允许通过ajax调用加载页面的书签。这是通过dojo.hash api完成的。所以......我认为你能做的最好的事情就是用它来触发你在主页面中写的回调。

对于滚动到已加载内容中的给定位置，可以使用node.scrollIntoView（）。

例如，假设你有一个名为“mainPane”的contentPane中加载名为“fragment.html”的HTML片段的页面，您的片段包含2个锚这样的：

-fragment.html ：

<a href="#anchor1">Anchor 1</a> 
<p>some very long contents...</p> 
<a href="#anchor2">Anchor 2</a> 
<p>some very long contents...</p>

现在说你的主页2个按钮（名为BTN1和BTN2），这将被用来加载片段，然后导航到适当的锚。然后，您可以连线，了下面的JavaScript，在你的主页：

<script type="text/javascript"> 
     require(['dojo/on', 
       'dojo/hash', 
       'dojo/_base/connect', 
       'dijit/layout/BorderContainer', 
       'dijit/layout/ContentPane', 
       'dijit/form/Button'], 
       function(on, hash, connect){ 
        dojo.ready(function(){ 
         var contentPane = dijit.byId('mainPane'); 
         var btn1 = dijit.byId('btn1'); 
         var btn2 = dijit.byId('btn2'); 
         btn1.on("Click", function(e){ 
           if (!(contentPane.get('href') == 'fragment.html')) { 
            contentPane.set("href", "fragment.html"); 
           } 
           hash("anchor1"); 
         }); 

         btn2.on("Click", function(e){ 
           if (!(contentPane.get('href') == 'fragment.html')) { 
            contentPane.set("href", "fragment.html"); 
           } 
           hash("anchor2"); 
         }); 

         // In case we have a hash in the URL on the first page load, load the fragment so we can navigate to the anchor. 
         hash() && contentPane.set("href", "fragment.html"); 

         // This callback is what will perform the actual scroll to the anchor 
         var callback = function(){ 
          var anchor = Array.pop(dojo.query('a[href="#' + hash() + '"]')); 
          anchor && anchor.scrollIntoView(); 
         }; 

         contentPane.on("DownloadEnd", function(e){ 
          console.debug("fragment loaded"); 
          // Call the callback the first time the fragment loads then subscribe to hashchange topic 
          callback(); 
          connect.subscribe("/dojo/hashchange", null, callback); 
         }); 
        }); // dojo.ready 
      }); // require    
</script>

来源

2012-01-02 11:54:35 Philippe

感谢您的帮助！我还没有尝试过，但这看起来正是我需要的！ – user1124421 2012-02-16 05:08:53

如果您加载内容包含的JavaScript，你应该使用dojox.layout.ContentPane。

来源

2012-01-02 17:40:10

在内容窗格中的html中加载javascript

回答

相关问题