1

asp.net Webアプリケーションにマスターページがあり、default.aspxはマスターページのコンテンツページです。

default.aspxでjQueryタブを使用していますが、アプリケーションを実行すると機能しません。ui-tabsのスタイルが表示されましたが、タブをクリックできません。

マスターページ自体で同じことを試してみると、タブコントロールは正常に機能しています。つまり、タブコンテナの適切なコンテンツを表示しているタブをクリックできます。

jQueryUIを使用しています

 <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 に答える