تعطيل روابط href في php-javascript

Question

لدي 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>

أريد تعطيل إضافة الروابط وإعادة تسميتها وحذفهافقط قم بتعطيله من واجهة المستخدم .

يجب أن يكون المستخدم قادرًا على رؤيته ولكن لا ينبغي تنفيذ أي حدث نقر (يجب أن تكون الروابط باللون الرمادي).

لقد استخدمت

1. disable="disabled"

2. display =none;

لكنها لا تخدم هذا الغرض.

هل هناك طريقة أخرى قد ينجح بها هذا؟

Answer 1

سأستخدم 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 القاعدة ولكنها غير مدعومة بشكل جيد في IE.

العرض التوضيحي: http://jsfiddle.net/LPz2Z/1/

Answer 2

إذا كنت تستخدم JQuery، فقد ترغب في القيام بذلك

giveacodicetagpre.

href="https://stackoverflow.com/questions/970388/jquery-disable-a-link"> مزيد من المعلومات، سؤال Stackoverflow

Answer 3

أنا لست متأكدا من أنها أفضل طريقة ولكن يمكن أن تفعل الخدعة،

إذا كنت تستخدم

giveacodicetagpre.

أو إذا كنت ترغب في الاتصال به من جافا سكريبت:

giveacodicetagpre.

للتفاعل المعطل مع المستخدمين الخاص بك.

Answer 4

استخدم مؤشر الأحداث: لا شيء؛

giveacodicetagpre.

Answer 5

هناك بعض الخيارات.مع JavaScript القديم العادي، يمكنك القيام به، على سبيل المثال:

giveacodicetagpre.

أو

giveacodicetagpre.

مع jQuery يمكنك بسهولة تعطيل الكثير من الروابط:

giveacodicetagpre.

ويمكنك حتى استخدام CSS!

giveacodicetagpre.

على الرغم من أنه لن يفاجئك، أي <= v9 (إذا كنت صحيحا) لا يدعم ذلك ... وعلى معظم المتصفحات، لا يمكنك إجبار المتصفح على استخدام مؤشر كمؤشر...

الكل في التجريبي القطط!

Answer 6

حتى هذا يقدم الغرض

giveacodicetagpre.

كما أستخدم فئة contextmenu في قائمة UL الخاصة بي.