Как отменить навигацию, когда пользователь нажимает ссылку (элемент <a>)?

Я пытаюсь загрузить некоторые вещи, используя AJAX, когда пользователь нажимает на ссылку, но я хочу, чтобы ссылка на самом деле шла куда-то, чтобы приложение все еще работало, когда javascript отключен. Есть ли способ сделать что-то с javascript и отменить навигацию при нажатии ссылки?

Какая лучшая практика? Может ли это быть сделано, или мне нужно заменить ссылку с помощью javascript или что?

Ответы

Ответ 1

Если у вас есть HTML:

<a href="no_javascript.html" id="mylink">Do Something</a>

Вы бы сделали что-то подобное с помощью jQuery:

$(document).ready(function() {
    $('#mylink').click(function() {
        doSomethingCool();
        return false; // cancel the event
    });
});

Все, что вам нужно сделать, это отменить событие click с помощью Javascript, чтобы предотвратить действие по умолчанию. Поэтому, когда кто-то нажимает на ссылку с включенным Javascript, вызывается doSomethingCool();, и событие click отменяется (таким образом, return false;) и не позволяет браузеру перейти на указанную страницу. Однако, если они отключены Javascript, это приведет их непосредственно к no_javascript.html.

Ответ 2

Ничего из этого не сработало для меня в браузере Google Chrome.

Вот что работает (используя jQuery):

$(document).ready(function() {
    $('#mylink').click(function(event) {
        doSomethingCool();
        event.preventDefault(); // cancel the event
    });
});

Ответ 3

почему jQuery?

HTML:

<a href="no_javascript.html" onclick="return doSmth()">Link</a>

... и код javascript:

function doSmth(){
  // your code here
  return false
}

Ответ 4

Я бы сделал:

а. для атрибута href javascript:void(); будет установлен

б. для события onclick, предоставит функцию для обработки события click, и эта функция вернет false.

например:

<script type="text/javascript">
   function myfunction()
   {
      //do something
      return false;
   }
   </script>

   <a href="javascript:void();" onclick="myfunction()">Link</a>

Ответ 5

<a href="http://www.google.com" class="ignore-click">Test</a>

с помощью jQuery:

<script>
    $(".ignore-click").click(function(){
        return false;
    })
</script>

с JavaScript

<script>
        for (var i = 0; i < document.getElementsByClassName("ignore-click").length; i++) {
            document.getElementsByClassName("ignore-click")[i].addEventListener('click', function (event) {
                event.preventDefault();
                return false;
            });
        }
</script>

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

Ответ 6

для IE по крайней мере, просто поместите this.event.returnValue = false; в конец метода.

например:

function onClickFunction()
 {
  someMethod();
  this.event.returnValue = false;
 }

У меня был сложный метод, когда это делало трюк.

Ответ 7

Я использую document.location.replace для навигации, но когда я хочу отменить навигацию, return false (в той же функции, что и document.location.replace) не отменяет навигацию.

Ответ 8

Лучший способ должен быть таким.

<a href="javascript:undefined"></a>

Ответ 9

прост, используйте атрибут rel= "nofollow"

 <a href="signin.php" rel="nofollow">sign in</a>