JQuery ToggleClass 및 브라우저 이동

클릭하면 링크의 모양이 변경되는 매우 간단한 토글 클래스가 있습니다. 한 가지를 제외하면 위대한 작품. 링크를 클릭 할 때마다 브라우저 포커스가 페이지의 맨 위로 다시 이동합니다. 링크가 페이지의 맨 아래에 있으면 이것은 매우 짜증납니다.JQuery ToggleClass 및 브라우저 이동

거친 크기와 같은 다른 요소를 사용할 수는 있지만 내 질문에 대한 해결책이 있는지 궁금합니다. 사용

예 링크 :

<a class="share-this" href="#">Share This</a>

출처

2010-01-16 Keith Donegan

또는이 기능뿐만 아니라 도움이 될 수

$('.share-this').toggleClass('some-class-that-is-toggled').click(function(e) { 
    return false; 
});

출처

2010-01-16 09:53:21 Tarik

당신이 정상에 화면을 복용 무엇 인 HREF에 규정 된 '#'로가는 링크를 클릭합니다.

이 기본 브라우저 동작을 방지하기 만하면됩니다. 클릭 이벤트를 처리하고 브라우저가 처리 할 수있는 버블 링을 방지하여이를 수행 할 수 있습니다. 어디서든하지 않을 경우

$('.share-this').toggleClass('some-class-that-is-toggled').click(function(e) { 
    e.preventDefault(); 
});

출처

2010-01-16 07:23:12

나 :.'$ ('. 주 -이') toggleClass ('일부 - 클래스 - 그 - 인 - 전환 ') .click (function (e) { false를 반환, }); ' – Tarik

@Aaron도 작동하지만 중요한 것은 false 반환이 약간 다릅니다. http://stackoverflow.com/questions/1357118/javascript-event-preventdefault-vs-return-false –

정보 주셔서 감사합니다 다시. 그것은 다른 정보를 배우는 것이 좋다 :) – Tarik

왜 링크를 사용

당신은 너무 같은 기본 클릭 동작을 방지 할 수 있습니까? 다른 요소 유형에 토글 코드를 추가하기 만하면됩니다. 그것의 주위에 일을 피할뿐만 아니라 의미 론적으로 정확하고 유지 보수가 명확해질 것입니다.

출처

2010-01-16 08:49:00 AUSteve

솔루션 ->

이 때문에 HREF = "#"을 사용으로 발생되는

<a class="share-this" href="javascript:void(0);">Share This</a>

"javascript : void (0); 효과적인" 대신에 #.

URL도 변경됩니다.

http://localhost:8080/appname http://localhost:8080/appname#

출처

2010-01-16 09:34:58 Vicky

JQuery ToggleClass 및 브라우저 이동

답변

관련 문제