jQuery로 클릭 한 후 링크 href 변경

Question

클릭하면 링크가 href 속성을 전환 한 다음 해당 위치로 이동하는 링크를 만들려고합니다.

내 HTML은 다음과 같습니다 클릭하면

<a href="http://google.com" rel="group" data-wpurl="http://yahoo.com"></a> 

, 나는 브라우저가 데이터 wpurl 위치하지 HREF 위치로 이동하고 싶습니다. 데이터 속성을 사용하는 이유는 내가 사용하고있는 응용 프로그램이 href ...를 사용해야하기 때문입니다. 여기서는 관련이 없습니다.

내 jQuery를이다 : 나는 e.preventDefault()를 사용하고

$('a[rel="group"]').on('click', function(e) { 
     e.preventDefault(); 
     var wpurl = $(this).attr("data-wpurl"); 
     $(this).attr('href', wpurl); 
}); 

; 브라우저가 사용자를 href로 가져 가지 못하도록합니다. 데이터 속성이 href에 할당 된 후 어떻게 클릭을 트리거 할 수 있습니까? trigger('click') 및 click();을 사용하면 작동하지 않습니다!

아이디어가 있으십니까?

Answer 1

그냥 바로 위치를 변경하는 것이 더 쉽습니다 :

e.preventDefault(); 
location.href = $(this).data('wpurl'); 

Answer 2

는하면 onMouseDown 사용합니다. Google은 검색 결과 페이지에서이 방법을 사용하므로 클릭 한 내용을 추적 할 수 있습니다. 링크가 어디로 가는지 보려면 왼쪽 대신 오른쪽을 클릭하십시오. 그들은 둘 다 onmousedown 이벤트를 트리거합니다.

<a href="http://google.com" data-wpurl="http://yahoo.com" onmousedown="rwt(this)">CLICK HERE</a> 

<script type="text/javascript"> 
    rwt = function(e){ 
    e.href = $(e).data('wpurl'); 
    } 
</script> 

Answer 3

http://jsfiddle.net/afLE3/

나는 원래 jQuery를이 e.preventDefault()을 제외하고, 좋은 생각이 상관없이 당신이 그 시점 이후의 href 속성에 무슨 이벤트 발사를 중지하지 않습니다.

$('a[rel="group"]').on('click', function(e) { 
     var wpurl = $(this).attr("data-wpurl"); 
     $(this).attr('href', wpurl); 
}); 

페이지가 새로 고침되기 전에 위 코드가 모두 실행됩니다. 하지만 필요없이 내 관점에서 e.preventDefault()

$('a[rel="group"]').on('click', function(e) { 
    e.originalEvent.currentTarget.href = $(this).data('wpurl'); 
}); 

를 호출

Answer 4

유사 솔루션이보다 일반적인, 청소기 솔루션이 (기본 브라우저 동작을 변경하지 않으므로,이다 예를 들면 : 때 사용자가 링크에서 마우스 휠로 클릭하면 Jacks 솔루션으로 새 탭이 열리지 않습니다.)