从已经有 javascript 代码的页面加载带有 javascript 代码的页面时 IE 崩溃答案

【问题标题】：IE Crashes on loading a page with javascript code from a page which already has a javascript code从已经有 javascript 代码的页面加载带有 javascript 代码的页面时 IE 崩溃
【发布时间】：2013-06-25 18:34:19
【问题描述】：

我有一个带有 Javascript 功能的 index.html 页面来创建标签：

$(function() {
    $("#tabs").tabs();
});

同一个index.html文件有2种页面的链接：

一个重定向到一个页面，该页面再次具有相同的标签页 JavaScript 函数。
其他重定向到一个没有标签页 JavaScript 函数的页面。

带有指向具有 JavaScript 函数的页面的链接的 index.html 页面在单击时在 IE 上崩溃。在 Chrome 和 Firefox 上运行没有任何问题。但是，没有 JavaScript 功能的页面链接（在 index.html 上）可以正常工作。我面临的问题是因为具有类似的 JavaScript 函数，用于在相互链接的 2 个页面上创建选项卡，这可能会导致冲突。

请告诉我如何解决此问题。

谢谢

我无法发布我的所有代码，因为它是专有的。但是我在下面发布了相关代码：

<script>
$(function() {
        $("#tabs").tabs();
        });
</script>

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">First Tab</a></li>
        <li><a href="#tabs-2">Second Tab</a></li>
    </ul>
    <div id="tabs-1">
    <a name='top'></a>
    <h3>First Tab</h3>
    <table border='1'>
    <tr>
        <td class='summary' bgcolor='#ffffcc'>&abcd;</td>
            <th class='summary' align='center'><a title='Tue Jun 25 05:50:49           
   2013' href='test.php?p=XYZ'>XYZ</a></th>
    </tr>
    <div id="tabs-2">
    <a name='top'></a>
    <h3>Second Tab</h3>
    <table border='1'>
            <td class='summary' bgcolor='#ffffcc'>&abcd;</td>
            <th class='summary' align='center'><a title='Tue Jun 25 05:50:49 
    2013' href='test.php?p=ABC'>ABC</a></th>
    </tr>
  </table>
  </div>

'test.php?p=XYZ' 是再次具有标签的 javascript 代码的页面 --> 在 IE 上不加载和崩溃的页面，在 chrome 和 firefox 上加载没有问题。 'test.php?p=ABC' 是没有任何标签的 JavaScript 代码的页面 --> 页面在 anyenter code here 浏览器上加载没有任何问题。

/*Sample code of the page that crashes, it crashes even when you access the link  
directly*/
<body>
<script>
$(function() {
    $("#tabs").tabs();
    });
</script>
<div id="tabs">
<ul>
    <li><a href="#tabs-1">First Tab</a></li>
    <li><a href="#tabs-2">Second Tab</a></li>
</ul>
<div id="tabs-1">
<a name='top'></a>
<table border='1'>
  <tr>
    <td class='summary' bgcolor='#ffffcc'>&abcd;</td>
            <th>2013-06-26</th>
            <th>2013-06-19</th>
            <th>2013-06-12</th>
            <th>2013-06-05</th>
            <th>&abcd;</th>
    <th>&abcd;</th>
  </tr>
  <tr>
    <td bgcolor='#ffffcc'>Display</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td><a href='some_link'>Sorted List</a></td>
    <td><a href='Another_link'>hyperlink</a></td>
  </tr>
 </table>
 </div>
 <div id="tabs-2">
<a name='top'></a>
<table border='1'>
  <tr>
    <td class='summary' bgcolor='#ffffcc'>&abcd;</td>
            <th>2013-06-26</th>
            <th>2013-06-19</th>
            <th>2013-06-12</th>
            <th>2013-06-05</th>
            <th>&abcd;</th>
    <th>&abcd;</th>
  </tr>
  <tr>
    <td bgcolor='#ffffcc'>Display</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td align='right'>14</td>
            <td><a href='some_link'>Sorted List</a></td>
    <td><a href='Another_link'>hyperlink</a></td>
  </tr>
 </table>
 </div>
</div>
</body>enter code here

【问题讨论】：

如果您直接打开崩溃页面（而不是通过链接）会发生什么？我认为它仍然会使浏览器崩溃...
根据您的解释应该没有问题，因为页面将相互独立。你能把你的 HTML 贴出来让我们看看吗？
这些链接是指向完全独立的页面，还是一个页面应用程序，其链接在同一页面内加载不同视图？
什么是&amp;abcd;？看起来实际上像一个实体，但不是一个已知的实体。您应该像&amp;abcd; 一样将其转义或将其删除以尝试；可能IE的JScript被tabs插件+一个未定义的实体破坏了......？你用的是什么版本的？
请从页面中发布一些正在使浏览器崩溃的内容。另一个页面很可能是错误的，这个页面（几乎）没有什么可以修复的。你还在评论里说直接打开就崩溃了……

标签： javascript jquery

【解决方案1】：

如果您的代码运行两次并打断页面，请使用指示器来避免该问题：

$(function() {
    var $tabs = $('#tabs'),
    done = $tabs.data('done');

    if (!done) {
        $tabs.tabs();
        $tabs.data('done',true);
    }
});

【讨论】：

如果我的 javascript 代码存在于一个页面中并且相同的 javascript 代码存在于另一个页面中并且指向第二个页面的链接存在于第一页中，我可以使用它吗？

【解决方案2】：

您使用的是 .onload 还是 .ready？也许延迟功能可能会消除问题？

【讨论】：

如果我直接加载崩溃页面，它会再次崩溃。不，我没有使用 .onload 或 .ready。
我无法发布我所有的代码，因为它是专有的。但是我在下面发布了相关代码：
可以肯定地说，发布的代码不会导致任何浏览器崩溃。 html 无效，因为您没有在第二个表中打开 tr 。此外，您还必须在 <script>$(document).ready(function(){ //code here });</script> 块中调用 .tabs()，该块位于 </body> 元素之前。