JQuery отключить ссылку - PullRequest
276 голосов
/ 09 июня 2009

Кто-нибудь знает, как отключить ссылку в jquery БЕЗ использования return false;?

В частности, я пытаюсь отключить ссылку на элемент, щелкнув по нему с помощью jquery, который вызывает некоторые вещи, а затем повторно включить эту ссылку, чтобы при повторном нажатии она работала по умолчанию.

Спасибо. Dave

UPDATE Вот код После применения класса .expanded необходимо повторно активировать отключенную ссылку.

$('ul li').click(function(e) {
    e.preventDefault();
    $('ul').addClass('expanded');
    $('ul.expanded').fadeIn(300);
    //return false;
});

Ответы [ 16 ]

353 голосов
/ 09 июня 2009
$('#myLink').click(function(e) {
    e.preventDefault();
    //do other stuff when a click happens
});

Это предотвратит поведение гиперссылки по умолчанию, которая заключается в посещении указанного href.

Из учебника jQuery :

Для клика и большинства других событий вы может предотвратить поведение по умолчанию - здесь, по ссылке на jquery.com - вызывая event.preventDefault () в обработчике событий

Если вы хотите preventDefault() только при выполнении определенного условия (например, что-то скрыто), вы можете проверить видимость вашего ul с помощью класса extended . Если она видна (т.е. не скрыта), ссылка должна срабатывать как обычно, так как оператор if не будет введен, и, следовательно, поведение по умолчанию не будет предотвращено:

$('ul li').click(function(e) {
    if($('ul.expanded').is(':hidden')) {
        e.preventDefault();
        $('ul').addClass('expanded');
        $('ul.expanded').fadeIn(300);
    } 
});
103 голосов
/ 09 июня 2009

Попробуйте это:

$("a").removeAttr('href');

Edit-

Из вашего обновленного кода:

 var location= $('#link1').attr("href");
 $("#link1").removeAttr('href');
 $('ul').addClass('expanded');
 $('ul.expanded').fadeIn(300);
 $("#link1").attr("href", location);
63 голосов
/ 12 сентября 2011

Для других, кто пришел сюда через Google, как я - вот другой подход:

css:
.disabled {
  color: grey; // ...whatever
}

jQuery:
$('#myLink').click(function (e) {
  e.preventDefault();
  if ($(this).hasClass('disabled'))
    return false; // Do something else in here if required
  else
    window.location.href = $(this).attr('href');
});

// Elsewhere in your code
if (disabledCondition == true)
  $('#myLink').addClass('disabled')
else
  $('#myLink').removeClass('disabled')

Помните: не только это класс CSS

класс = "ButtonStyle"

но и эти два

class = "стиль кнопки отключен"

, чтобы вы могли легко добавлять и удалять другие классы с помощью jQuery. Не нужно трогать href ...

Я люблю JQuery! ; -)

51 голосов
/ 29 февраля 2012

Вот альтернативное решение css / jQuery, которое я предпочитаю за его краткость и минимизированный сценарий:

CSS:

a.disabled {
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
}

JQuery:

$('.disableAfterClick').click(function (e) {
   $(this).addClass('disabled');
});
16 голосов
/ 12 июня 2013

Вы можете удалить клик для ссылки, следуя;

$('#link-id').unbind('click');

Вы можете снова активировать ссылку,

$('#link-id').bind('click');

Вы не можете использовать свойство 'disabled' для ссылок.

14 голосов
/ 08 мая 2014

Если вы идете по маршруту HREF, вы можете сохранить его

Для отключения:

$('a').each(function(){
    $(this).data("href", $(this).attr("href")).removeAttr("href");
});

Затем включите снова:

$('a').each(function(){
    $(this).attr("href", $(this).data("href"));
});

В одном случае мне пришлось сделать это таким образом, потому что события щелчка уже были связаны где-то еще, и я не мог их контролировать.

8 голосов
/ 26 февраля 2014

Я всегда использую это в jQuery для отключения ссылок

$("form a").attr("disabled", "disabled");
4 голосов
/ 09 сентября 2018

Пример ссылки html:

        <!-- boostrap button + fontawesome icon -->
        <a class="btn btn-primary" id="BT_Download" target="blank" href="DownloadDoc?Id=32">
        <i class="icon-file-text icon-large"></i>
        Download Document
        </a>

используйте это в jQuery

    $('#BT_Download').attr('disabled',true);

добавить это к css:

    a[disabled="disabled"] {
        pointer-events: none;
    }
4 голосов
/ 04 июля 2013

Мой фаворит в "оформлении заказа, чтобы редактировать элемент и предотвращать -дисковые клики на диком западе в любом месте, находясь в оформлении заказа"

$('a').click(function(e) {
    var = $(this).attr('disabled');
    if (var === 'disabled') {
        e.preventDefault();
    }
});

Поэтому, если я хочу, чтобы все внешние ссылки на панели инструментов второго действия были отключены в режиме редактирования, как описано выше, я добавлю в функцию редактирования

$('#actionToolbar .external').attr('disabled', true);

Пример ссылки после пожара:

<a href="http://goo.gl" target="elsewhere" class="external" disabled="disabled">Google</a>

И теперь вы МОЖЕТЕ использовать отключенное свойство для ссылок

Ура!

3 голосов
/ 13 января 2016

Вы можете просто скрыть и показать ссылку, как вам нравится

$(link).hide();
$(link).show();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...