У меня проблемы с использованием event.preventDefault ();для Ahref на моем DOM - PullRequest
5 голосов
/ 09 июня 2011

У меня проблемы с использованием event.preventDefault(); для ahref в моем DOM.

Как предотвратить публикацию в URL удаления nofollow, как указано в HTML с использованием JQuery?

<td class="trash_can">
<a rel="nofollow" data-remote="true" data-method="delete" data-confirm="Are you sure you want to delete Greek Theater at U.C. Berkeley?" href="/promotions/2/places/46">
<img id="trash_can" src="http://test.dev/images/trash.png?1305741883" alt="Trash">

Следующий код должен подорвать HTML, но HTML отправляет действие удаления, прежде чем выдает предупреждение «Вы уверены». ничего не работает:

  $(function(){
  $('.trash_can a').click(function(event) {
    event.preventDefault();
    console.log('Clicked Delete');
  });
});

Ответы [ 3 ]

7 голосов
/ 09 июня 2011

Возможно, что вместо event.preventDefault() вам нужно будет также return false или вместо этого. protectDefault () предотвращает действие по умолчанию, но событие все еще всплывает, возможно, к следующему обработчику, который может быть обработчиком rails, на который указал Фредрик:

 $(rails.linkClickSelector).live('click.rails', function(e) {
    var link = $(this);
    if (!rails.allowAction(link)) return rails.stopEverything(e);

    if (link.data('remote') !== undefined) {
      rails.handleRemote(link);
      return false;
    } else if (link.data('method')) {
      rails.handleMethod(link);
      return false;
    }
  });
4 голосов
/ 09 июня 2011

Вы используете рельсы? Похоже на это.

Причина, по которой event.preventDefault() не работает, заключается в том, что магия делается в другом месте. Rails поставляется с некоторыми помощниками, которые создают обработчики событий для всех действий «delete», генерируемых Rails. Поэтому в вашем случае я думаю, что вам нужно выяснить, как переопределить помощники или просто создать собственный обработчик событий для этого конкретного действия удаления.

Это код JQuery, который использует Rails:

https://github.com/rails/jquery-ujs/blob/master/src/rails.js

На основании этого (из ссылки):

linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]'

Ваш обработчик событий будет единственным, выполняемым, если вы удалите data-remote, data-method и data-confirm из ссылки.

Поэтому я предлагаю вам удалить их, а затем просто заново создать любое поведение, которое вы хотите, в своем собственном обработчике кликов.

0 голосов
/ 25 ноября 2015

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

function enableLink() {
  jQuery("#link_id").removeClass("disabled");
  jQuery("#link_id").attr("data-remote", true);
}


function disableLink() {
  jQuery("#link_id").addClass("disabled");
  jQuery("#link_id").removeAttr("data-remote");
}

jQuery(document).ready(function(){
  jQuery(document).on("click", "disabled", function(e){
    e.preventDefault();
  });
});

Я понимаю, что это не хороший обходной путь. Но вот что мне помогло.

...