자바 스크립트를 사용하여 모든 문서 링크 클릭을 차단합니다.

Question

문서에서 링크 클릭을 가로채는 방법은 무엇입니까? 크로스 플랫폼이어야합니다.

나는 이런 식으로 뭔가를 찾고 있어요 :

// content is a div with innerHTML 
var content = document.getElementById("ControlPanelContent"); 

content.addEventListener("click", ContentClick, false); 

function ContentClick(event) { 

    if(event.href == "http://oldurl") 
    { 
    event.href = "http://newurl"; 
    } 
} 

감사를 사전에 도움을.

Answer 1

for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){ 
    ls[i].href= "...torture puppies here..."; 
} 

대신에 onclick 처리기를 변경하고 변경하지 않고 가로 채고 싶을뿐입니다. 이것은 URL로 이동하기 전에 호출되는 것입니다

var handler = function(){ 
    ...torment kittens here... 
} 
for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){ 
    ls[i].onclick= handler; 
} 

주 document.links 것을 또한 href 속성 AREA 요소 포함 -뿐만 아니라 A 요소를.

Answer 2

방금 ​​발견했으며 일부 사람들에게 도움이 될 수 있습니다. 가로 채기 외에도 링크가 다른 페이지를로드하거나 현재 페이지를 다시로드하지 못하도록하려면 그냥 href를 '#'으로 설정하십시오 (내부 페이지 참조 접두사 에서처럼). 이제 링크를 사용하여 동일한 페이지에 머물면서 함수를 호출 할 수 있습니다.

Answer 3

페이지를 사용하는 동안 링크가 생성되는 경우는 어떻게됩니까? 이것은 오늘날의보다 복잡한 프런트 엔드 프레임 워크에서 자주 발생합니다.

적절한 해결책은 아마도 클릭 이벤트 리스너를 문서에 올려 놓는 것입니다. 이것은 요소의 이벤트가 부모에게 전파되고 링크가 실제로 최상위 부모에 의해 작동되기 때문입니다.

페이지를로드했는지 또는 모든 시점에서 프런트 엔드에서 동적으로 생성했는지에 관계없이 모든 링크에서 작동합니다.

function interceptClickEvent(e) { 
    var href; 
    var target = e.target || e.srcElement; 
    if (target.tagName === 'A') { 
     href = target.getAttribute('href'); 

     //put your logic here... 
     if (true) { 

      //tell the browser not to respond to the link click 
      e.preventDefault(); 
     } 
    } 
} 


//listen for link click events at the document level 
if (document.addEventListener) { 
    document.addEventListener('click', interceptClickEvent); 
} else if (document.attachEvent) { 
    document.attachEvent('onclick', interceptClickEvent); 
}