0

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

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

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

  1. 一种重定向到一个页面，该页面再次具有相同的 JavaScript 选项卡功能。
  2. 其他重定向到没有用于标签的 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 代码的页面 --> 页面加载在任何enter 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
4

2 回答 2

0

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

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

    if (!done) {
        $tabs.tabs();
        $tabs.data('done',true);
    }
});
于 2013-06-25T19:18:48.023 回答
-1

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

于 2013-06-25T18:40:42.320 回答