HTML 링크를 효과적으로 비활성화하려면 어떻게 해야 합니까?

HTML 링크 비활성화

링크는 다양한 방법으로 비활성화할 수 있으며 각 방법에는 장단점이 있습니다.

1. CSS 방법(권장)

a.disabled {
    pointer-events: none;
}

이 방법은 이식 가능한 솔루션을 제공하므로 선호되는 옵션입니다. 그러나 Internet Explorer와 같은 이전 브라우저는 포인터 이벤트를 완전히 지원하지 않습니다. 이 문제를 해결하려면 비활성화된 속성을 사용하는 것이 좋습니다.

a[disabled] {
    pointer-events: none;
}

2. 포커스 가로채기

tabindex를 사용하면 링크가 포커스되는 것을 방지하여 키보드를 통해 연결할 수 없게 만들 수 있습니다.

<a href="#" disabled tabindex="-1">...</a>

이 방법은 클릭 이벤트를 방지하지 않습니다.

3. 클릭 차단(JavaScript)

JavaScript 이벤트 리스너를 사용하여 링크 클릭을 차단하고 비활성화된 플래그를 확인합니다.

$("td > a").on("click", function(event){
    if ($(this).is("[disabled]")) {
        event.preventDefault();
    }
});

4. 링크 지우기

링크가 작동하지 않게 하려면 href 속성을 제거하세요.

$("td > a").each(function() {
    this.data("href", this.attr("href"))
        .attr("href", "javascript:void(0)")
        .attr("disabled", "disabled");
});

5. 가짜 클릭 핸들러

링크를 비활성화하려면 false를 반환하는 클릭 핸들러를 추가하세요.

$("td > a").attr("disabled", "disabled").on("click", function() {
    return false; 
});

비활성화된 링크 스타일 지정

다음을 사용하세요. 비활성화된 속성 또는 스타일에 대한 클래스 비활성화됨 링크:

a[disabled] {
    color: gray;
}

ARIA 지원

스크린 리더에 대한 접근성을 보장하려면 비활성화된 속성/클래스와 함께 aria-disabled="true"를 포함하세요.

위 내용은 HTML 링크를 효과적으로 비활성화하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!