programing

middle click (새 탭) 및 javascript 링크

css3 2023. 10. 27. 22:07

middle click (새 탭) 및 javascript 링크

저는 직장에서 웹사이트를 담당하고 있는데, 최근에는 더 빠르고 대응력을 높이기 위해 아약스 요청을 추가했습니다.하지만 그것은 문제를 제기했습니다.

제 페이지에는 메뉴처럼 왼쪽에 색인표가 있습니다.클릭하면 페이지의 나머지 부분을 채우는 요청이 이루어집니다.언제든지 색인의 다른 항목을 클릭하여 다른 페이지를 로드할 수 있습니다.

javascript를 추가하기 전에 인덱스의 각 항목에 대해 미들클릭(새 탭 열기)이 가능하여 그 중 하나를 처리하는 동안 다른 페이지를 로드할 수 있었습니다.하지만 제가 모든 링크를 ajax 요청으로 변경했기 때문에, 그들은 이제 실제 링크가 아닌 javascript를 실행합니다.그래서 중간에 클릭하면 빈 탭만 열립니다.

왼쪽 클릭 시 javascript 실행 링크, 중간 클릭 시 새 탭 두 기능을 결합할 수 있는 방법이 있습니까?클릭할 때마다 잡고 그에 맞게 처리하는 추한 자바스크립트가 있어야 하나요?

감사해요.

네. 대신에:

<a href="javascript:code">...</a>

작업:

<a href="/non/ajax/display/page" id="thisLink">...</a>

그런 다음 JS에서 ID를 통해 링크를 걸면 AJAX 통화가 가능합니다.클릭 이벤트가 버블링 되지 않도록 해야 합니다.대부분의 프레임워크에는 호출할 수 있는 이벤트 킬러가 내장되어 있습니다(이벤트 클래스만 봐도 알 수 있습니다).

다음은 jquery의 이벤트 처리 및 이벤트 킬러입니다.

$("#thisLink").click(function(ev, ob) {
    alert("thisLink was clicked");
    ev.stopPropagation();
});

물론 이런 것들을 저글링하면서 훨씬 더 영리해질 수 있지만, 이 방법이 사용하는 것보다 훨씬 더 깨끗하다는 것을 강조하는 것이 중요하다고 생각합니다.onclick특성.

JS를 JS에 유지하세요!

네, 점진적인 향상과 눈에 띄지 않는 자바스크립트를 찾아보시고, 먼저 자바스크립트가 활성화되지 않은 상태에서 작동하도록 사이트를 코드화한 후 기본 사이트가 작동된 후 자바스크립트 기능을 추가하셔야 합니다.

올리의 접근법은 마음에 들었지만, 왼쪽 클릭과 중간 클릭을 구분하지 못했습니다.이벤트 Args에서 "where" 필드를 확인하면 알려줍니다.

$(".detailLink").click(function (ev, ob) {
    //ev.which == 1 == left
    //ev.which == 2 == middle
    if (ev.which == 1) {
        //do ajaxy stuff

        return false; //tells browser to stop processing the event
    }
    //else just let it go on its merry way and open the new tab.
});

테스트가 좀 필요하겠지만, 대부분의 브라우저는 클릭할 때 클릭 핸들러를 실행하지 않아 링크만 활용된다고 생각합니다.

그러나 일반적으로 클릭할 때 이러한 링크가 사용되지 않도록 하려면 핸들러 기능이 false를 반환해야 합니다.

편집: 예를 들 수 있다고 느꼈습니다.

<a href="/Whatever/Wherever.htm" onclick="handler(); return false;" />
<a href="/original/url" onclick="return !doSomething();">link text</a>

자세한 내용과 자세한 설명은 다른 게시물에서 제 답변을 보세요.

아마, 저는 두 개의 링크를 매번 제공할 수 있을 것입니다. 하나는 자바스크립트를 실행하고 다른 하나는 미들클릭이 가능한 실제 링크입니다.그 중 하나가 인덱스에 과부하가 걸리지 않도록 이미지여야 할 것 같습니다.

해당 유형의 클릭에 대해 on click 이벤트가 실행되지 않으므로 다음을 추가해야 합니다.href실제로 작동하는 속성입니다.이것을 할 수 있는 하나의 방법은 다음과 같이 추가하는 것입니다.#bookmarkURL에 입력하여 필요한 상태를 대상 페이지에 표시합니다.

언급URL : https://stackoverflow.com/questions/152262/middle-click-new-tabs-and-javascript-links