2012-07-17 7 views
2

이것이 작동하지 않는 이유에 대한 다른 질문을 모두 시도했습니다. 내 헤더이로드 해요 :jQuery show/hide not working

<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> 

: 여기

스크립트를 불러 의미하는 링크입니다 : 여기

<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>

내 스크립트입니다 그리고 나서 다음과 같이 세 개의 div가 있습니다 :

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

kneeshoulder divs는 페이지로드시 올바르게 숨기지 만 링크는 작동하지 않습니다. Google 크롬을 사용 중이며 요소를 검사 할 때 자바 스크립트에 대한 오류가 표시되지 않습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

+1

바이올린에 주어진 HTML 코드로 이전 HTML을 덮어 '$ (document) .ready (function() {'이 쓰여졌습니다!) 하나의 DOM 준비 함수를 사용하여 모든 것을 마무리하십시오. – TheZ

+0

편집하면 귀하의 게시물을 제거하고 오류를 제거하면 아무도 실제로 나중에 답변을 따라갈 수 없으므로 너무 늦게 온 모든 사람들을 위해 편집하기 전에이'id = "# patient-portal-link"와 같은 맨 아래에 링크가 있습니다. 따라서 jQuery 선택기가 제대로 작동하지 않았습니다. – Horen

+0

예, 사과드립니다. 오류를 발견했으며 문제가 무엇인지 알지 못했습니다. 무릎 덩어리 반응의 종류. 원래 질문을 원래 상태로 되돌립니다. – GhostToast

답변

10

ID 값에서 #자를 제거하십시오. jQuery에서 # 문자는 요소의 ID를 나타내므로 # (##knee-tab) 두 개가 필요합니다.

+1

내가 그것을 지우기 전에 당신이 대답했다. .. 하하. 고마워. – GhostToast

+1

응답을 충분히 빠르게 받아 들일 수 없음 – GhostToast

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> 
1

문제는 HTML 코드에 있습니다. HTML의 ID에는 해시 '#'이 필요하지 않습니다.

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(); 
    }); 

}); 
0

클릭 here

확인이 코드에서이 바이올린 당신이 ID 에 추가 #를 입력 한 당신은하지