1

我在 asp.net Web 应用程序中有一个母版页,而 default.aspx 是母版页的内容页。

我在 default.aspx 中使用 jQuery 选项卡,当我运行应用程序时它不起作用:ui-tabs 的样式已经出现,但我无法单击选项卡。

当我在母版页本身尝试相同的事情时,选项卡控件工作正常我的意思是我可以单击显示选项卡容器的适当内容的选项卡

我正在使用 jQuery UI

 <link href="css/jquery-ui-1.10.2.custom.css" rel="stylesheet" type="text/css" />
<script src="js/tab/jquery-ui-1.10.2.custom.js" type="text/javascript"></script>

   <div id="quicksearch">
    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">Quick Search</a></li>
            <li><a href="#tabs-2">Quick Register</a></li>
        </ul>
        <div id="tabs-1">
            <h1>
                Quick search</h1>
        </div>
        <div id="tabs-2">
            <h1>
                Quick Register</h1>
        </div>
    </div>
</div>

我用来选择标签的功能:

$( "#tabs" ).tabs();

这里会有什么问题?

4

2 回答 2

0

您的 id 将被 asp.net 破坏。使用类选择器像这样引用您的选项卡,当您的页面呈现时,该选择器将保持不变。

头部分的母版页

你的 jquery 在这里导入

 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

 <script type="text/javascript">
   $(document).ready(function ()
    {
    //initialization code
     $(".tabs" ).tabs();
     }
</script>

然后在你的内容页面

<div class="tabs">
    <ul>
        <li><a href="#tabs-1">Quick Search</a></li>
        <li><a href="#tabs-2">Quick Register</a></li>
    </ul>
    <div id="tabs-1">
        <h1>
            Quick search</h1>
    </div>
    <div id="tabs-2">
        <h1>
            Quick Register</h1>
    </div>
</div>

在撰写本文时,上述链接对我有用。此处为压缩演示

在此处输入图像描述

于 2013-03-25T13:44:47.397 回答
0

@AbideMasaraure 解决了我的问题.... 成千上万的人感谢他.... 问题是样式表中内容类中的负 z-index

于 2013-03-27T13:06:57.403 回答