2

これがうまくいかない理由について、他のすべての質問を調べてみましたが、うまくいきませんでした。これをヘッダーにロードしています：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

これが私のスクリプトです：

$(document).ready(function() {
    $("#knee-tab").hide();
    $("#shoulder-tab").hide();
});
$(function () {
    $("#patient-portal-link").click (function (event) {
        $("#patient-portal-tab").show();
        $("#knee-tab").hide();
        $("#shoulder-tab").hide();
    });
}); 
$(function () {
    $("#knee-link").click (function (event) {
        $("#patient-portal-tab").hide();
        $("#knee-tab").show();
        $("#shoulder-tab").hide();
        }); 
}); 
$(function () {
    $("#shoulder-link").click (function (event) {
        $("#patient-portal-tab").hide();
        $("#knee-tab").hide();
        $("#shoulder-tab").show();
    }); 
});

スクリプトを呼び出すためのリンクは次のとおりです。

<ul>
<li><a id="#patient-portal-link">Patient Portal</a></li>
<li><a id="#knee-link">Knee</a></li>
<li><a id="#shoulder-link">Shoulder</a></li>
</ul>

そして、次のように名前が付けられた 3 つの div があります。

<div id="patient-portal-tab">Patient portal content</div>
<div id="knee-tab">Knee content</div>
<div id="shoulder-tab">Shoulder content</div>

kneeおよびdivはshoulderページの読み込み時に正しく非表示になりますが、リンクは何もしません。Google Chrome を使用していますが、要素を検査するときに、javascript のエラーは報告されません。私は何を間違っていますか？

4

5 に答える 5

10

#ID 値から文字を削除します。jQueryの#文字は要素の ID を表すため、これが機能するには 2 つ#の ( ##knee-tab) が必要です。

于 2012-07-17T20:29:10.037 に答える
2

ID の前に # 記号があることを確認します。このように書き直すとうまくいきます

<li><a id="patient-portal-link">Patient Portal</a></li>
<li><a id="knee-link">Knee</a></li>
<li><a id="shoulder-link">Shoulder</a></li>
于 2012-07-17T20:29:49.303 に答える
1

問題は HTML コードにあります。HTML の ID にはハッシュ「#」は必要ありません。

于 2012-07-17T20:32:43.453 に答える
1

$(function() ... )$(document).ready(function() ...)私が正しく思い出した場合の省略形です。したがって、使用可能なコールが多すぎます。これを試して：

$(document).ready(function() {
    $("#knee-tab").hide();
    $("#shoulder-tab").hide();

    $("#patient-portal-link").click (function (event) {
        $("#patient-portal-tab").show();
        $("#knee-tab").hide();
        $("#shoulder-tab").hide();
    });{

    $("#knee-link").click (function (event) {
        $("#patient-portal-tab").hide();
        $("#knee-tab").show();
        $("#shoulder-tab").hide();
        }); 

    $("#shoulder-link").click (function (event) {
        $("#patient-portal-tab").hide();
        $("#knee-tab").hide();
        $("#shoulder-tab").show();
    }); 

});
于 2012-07-17T20:33:16.767 に答える