Якорная ссылка HTML - href и onclick оба?

Я хочу создать тег привязки, который выполняет некоторый JavaScript, а затем переходит туда, куда он hrefего взял. Вызов функции, которая выполняет мой JavaScript, а затем устанавливает window.locationили top.locationв hrefместоположение, для меня не работает.

Итак, представьте, что у меня есть элемент с идентификатором «Foo» на странице. Я хочу создать привязку, похожую на:

<a href="#Foo" onclick="runMyFunction(); return false;">Do it!</a>

При щелчке по нему я хочу выполнить runMyFunction, а затем перейти на страницу #Foo(не вызывать перезагрузки - использование top.locationприведет к перезагрузке страницы).

Предложения? Я счастлив использовать jQuery, если он может здесь помочь ...

Просто return trueвместо этого?

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

<a href="#Foo" onclick="return runMyFunction();">Do it!</a>

а также

function runMyFunction() {
  //code
  return true;
}

Таким образом, ваша функция будет выполнена, И вы перейдете по ссылке, И вы перейдете по ссылке точно после того, как ваша функция была успешно запущена.

Если ссылка должна изменить местоположение только в случае успешного выполнения функции, то сделайте это, onclick="return runMyFunction();"и в функции вы вернете true или false.

Если вы просто хотите запустить функцию, а затем позволить тегу привязки выполнить свою работу, просто удалите return falseоператор.

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

При создании чистой HTML-структуры вы можете использовать это.

//Jquery Code
$('a#link_1').click(function(e){
  e . preventDefault () ;
  var a = e . target ;
  window . open ( '_top' , a . getAttribute ('href') ) ;
});

//Normal Code
element = document . getElementById ( 'link_1' ) ;
element . onClick = function (e) {
  e . preventDefault () ;
  
  window . open ( '_top' , element . getAttribute ('href') ) ;
} ;

<a href="#Foo" id="link_1">Do it!</a>