2012-08-05 2 views
14

나는 이미지로 버튼이 ...자바 스크립트 인라인 onclick을 고토 지역 앵커

<img src="button.png" /> 

나는 그것이 로컬 앵커로 이동합니다 클릭 온 클릭 몇 가지 자바 스크립트가 필요합니다. 예 :

<img src="button.png" onclick="navigateTo #page10" /> 

어떻게하면됩니까?

업데이트 :

onclick="document.location=#goToPage';return false;" 
+0

이 답변을 보았습니까? 은 아마뿐만 아니라 하이퍼 링크의 이미지를 포장하는 이유가 http://stackoverflow.com/questions/8908191/use-jquery-click-to-handle-anchor-onclick – devanand

+0

을하는 데 도움이? –

+0

네, 이유는 자동으로 헤더를 Satch3000

답변

13

그것은 onClick이 있어야한다 보인다 : 허용 대답에 제시

onclick="document.location+='#goToPage';return false;" 
+4

아래의 Tivie의 대답을보십시오. 이 답변은 한 번만 사용할 수 있다고 지적합니다. 그 후에 URL의 끝에 #tag를 추가하고 아무 것도하지 않습니다. – Dave

3

는 앵커 태그에 랩 : 이것은 내가 사용하고 코드입니다. JS를 사용할 필요가 없습니다.

<a data-role="none" href="#page10"><img src="button.png" /></a> 
+0

그것 jquery 모바일 및 이렇게하면 Satch3000

+0

http://stackoverflow.com/ 질문/8959519/추가 클래스를 추가하지 못하도록''에'data-role = "none"'을 추가 할 수 있습니다. – foz

+2

6 년 후에도 여전히 가장 적합한 대답 인 것처럼 보입니다. 사람들이 왜 JS를 지나치게 복잡하게 만들 필요성을 느끼는지 확신 할 수 없습니다. OP가 JS 솔루션을 요청했다고해서 다른 업체가 잘못되었다는 것을 의미하지는 않습니다. 요점은 JS 요구 사항이 필요없는 이유에 대한 @ foz의 의견을 참조하십시오. –

17

이 솔루션은 단지 1 시간을 사용할 수 있다는 중요한 문제를 가지고있다. 각 연속 클릭은 위치에 #goToPage을 추가하고 창은 앵커로 이동하지 않습니다.

해결책은 새로운 앵커를 추가하기 전에 앵커 부분을 제거하는 것입니다 :

function goToAnchor(anchor) { 
    var loc = document.location.toString().split('#')[0]; 
    document.location = loc + '#' + anchor; 
    return false; 
} 

사용 예 : 앵커는 해시 접두사없이, 따옴표로 묶어야 필요가

<a href="#anchor" onclick="goToAnchor('anchor')">Anchor</a> 

주 .

+3

이것은 허용 된 대답이어야합니다. – Dave

+1

멋진 솔루션! – andresmafra

관련 문제