Disable a href 링크 php-javascript
-
02-01-2020 - |
문제
나는 4 마이 페이지의 링크(.phtml 파일)를 다음과 같이
<ul id="fileMenu" class="contextMenu">
<li class="add"><a id ="addbtn" href="#add" style="display:none;">Add</a></li>
<li class="download"><a href="#download">Download</a></li>
<li class="rename"><a href="#rename">Rename</a></li>
<li class="del"><a href="#delete">Delete</a></li>
<li class="copypath"><a href="#copypath">Copypath</a></li>
</ul>
나는 사용하지 않으려는 추가 삭제,이름 변경 링크 단지 그것을 사용하지 않도록 설정하에서 UI .
사용자를 볼 수 있어야 하지 않을 클릭하고 이벤트를 수행(linksshould 회색으로 표시됩).
용
disable="disabled"
display =none;
그러나 그들은 제공하지 않습니다.
다른 방법이 작동할 것입니까?
해결책
내가 사용하는 것이 CSS 시각적으로 비활성화에 대한 링크:
.disable {
position: relative;
}
.disable:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
}
.disable a {
color: gray;
cursor: default;
}
다음 순서로 사용하지 않는 링크를 넣어 클래스 disable
에 해당하는 li
:
<li class="download disable"><a href="#download">Download</a></li>
그것이 무엇을 기본적으로 오버레이 링크를 가진 투명한 의사소 :before
.
다른 해결책이 될 수 있을 사용하여 pointer-events: none
규칙하지만 잘되지에서 지원됩니다.
Demo: http://jsfiddle.net/LPz2Z/1/
다른 팁
jQuery를 사용하는 경우이 작업을 수행 할 수 있습니다
$(function() {
$('#addbtn').click(function(e) {
e.preventDefault();
//do other stuff when a click happens
});
}
.
나는 그것이 가장 좋은 방법이라고 확신하지 못해, 그것은 트릭을 할 수있다,
를 사용하는 경우
pointer-events: none; in your css
.
또는 JavaScript에서 호출하려는 경우 :
elem.style.display.pointerEvents = "none";
.
사용자와의 상호 작용을 비활성화합니다.
포인터 - 이벤트 사용 : 없음;
<a style='pointer-events:none;background-color:#CFCFCF;color:#000' href="javascript: void(0)">Delete</a>
. 몇 가지 옵션이 있습니다.일반 오래된 JavaScript를 사용하면 예를 들어 다음과 같습니다.
<a href="mylink.html" onclick="return false;">Download</a>
.
또는
<a href="javascript: void(0);">Download</a>
.
jQuery를 사용하면 많은 링크를 쉽게 사용하지 않도록 설정할 수 있습니다.
<a href="mylink.html" class="disabled">Download</a>
<a href="anotherlink.html" class="disabled">Delete</a>
<script>
jQuery(document).ready(function($) {
$('a.disabled').on('click', function(e) {
e.preventDefault();
});
});
</script>
.
및 CSS를 사용할 수도 있습니다!
<a href="mylink.html" class="disabled">Download</a>
<style type="text/css">
a.disabled { pointer-events: none; }
</style>
.
, 즉, <= v9 (올바른 경우)를 지원하지 않는 것은 당신을 놀라게하지 않을 것입니다 ... 그리고 대부분의 브라우저에서 브라우저가 포인터를 커서로 사용하도록 강제로 할 수는 없습니다...
이이 목적을 제공했습니다
$("#fileMenu").disableContextMenuItems('#add');
$("#fileMenu").disableContextMenuItems('#rename');
$("#fileMenu").disableContextMenuItems('#delete');
.
내 UL 목록에서 contextmenu 클래스를 사용하고 있습니다.