У меня есть привязка с обоими HREF
и ONCLICK
установленными атрибутами. Если щелкнуть и Javascript включен, я хочу, чтобы он только выполнялся ONCLICK
и игнорировался HREF
. Точно так же, если Javascript отключен или не поддерживается, я хочу, чтобы он следовал HREF
URL-адресу и игнорировал ONCLICK
. Ниже приведен пример того, что я делаю, при котором выполняется JS и выполняется одновременный переход по ссылке (обычно выполняется JS, а затем страница изменяется):
<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>
как лучше всего это сделать?
Я надеюсь на ответ Javascript, но я приму любой метод, если он работает, особенно если это можно сделать с помощью PHP. Я уже читал « ссылка href выполняется и перенаправляет страницу до того, как функция javascript onclick сможет завершиться », но это только задерживает HREF
, но не полностью отключает ее. Я тоже ищу что-нибудь попроще.
Ответы:
Вы можете использовать первое неотредактированное решение, если сначала поставите return в
onclick
атрибуте:<a href="https://example.com/no-js-login" onclick="return yes_js_login();">Log in</a> yes_js_login = function() { // Your code here return false; }
Пример: https://jsfiddle.net/FXkgV/289/
источник
yes_js_login = function() { // Your code here return false; }
Если вы вернете false, это должно предотвратить действие по умолчанию (переход к href).
Изменить: К сожалению, это не работает, вместо этого вы можете сделать следующее:
<a href="http://example.com/no-js-login" onclick="yes_js_login(); return false;">Link</a>
источник
onclick="return yes_js_login();"
сyes_js_login
возвратомfalse
event.stopImmediatePropagation()
Просто отключите использование браузера по умолчанию
preventDefault
и передайте егоevent
в свой HTML.<a href=/foo onclick= yes_js_login(event)>Lorem ipsum</a>
yes_js_login = function(e) { e.preventDefault(); }
источник
<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
любому количеству элементов, которые вам нравятся, и щелчки по этим элементам будут игнорироваться.источник
.btn-loading
добавляется к нажатой ссылке, а затем в случае успеха галочка (при ошибке X) заменяет анимацию загрузки. Я не хочу, чтобы кнопку можно было снова нажимать в некоторых случаях (как для успеха, так и для ошибки), используя это, я могу просто$(elemnent).addClass('disabled')
и легко достичь функциональности, которую я искал, элегантным способом!Вы можете использовать этот простой код:
<a href="" onclick="return false;">add new action</a><br>
источник
Это проще, если вы передадите такой параметр события:
<a href="#" onclick="yes_js_login(event);">link</a>
function yes_js_login(e) { e.stopImmediatePropagation(); }
источник
Это может помочь. Не требуется JQuery
<a href="../some-relative-link/file" onclick="this.href = 'https://docs.google.com/viewer?url='+this.href; this.onclick = '';" target="_blank">
Этот код выполняет следующие действия: передает относительную ссылку в Google Docs Viewer.
this.href
Итак, в вашем случае это может сработать:
<a href="../some-relative-link/file" onclick="this.href = 'javascript:'+console.log('something has stopped the link'); " target="_blank">
источник
Я решил ситуацию, когда мне нужен был шаблон для элемента, который альтернативно обрабатывал бы обычный URL или вызов javascript, где функции js нужна ссылка на вызывающий элемент. В javascript «this» работает как ссылка на себя только в контексте элемента формы, например кнопки. Мне не нужна была кнопка, просто появление обычной ссылки.
Примеры:
<a onclick="http://blahblah" href="http://blahblah" target="_blank">A regular link</a> <a onclick="javascript:myFunc($(this));return false" href="javascript:myFunc($(this));" target="_blank">javascript with self reference</a>
Атрибуты href и onClick имеют одинаковые значения, за исключением того, что я добавляю «return false» в onClick, когда это вызов javascript. Наличие «return false» в вызываемой функции не сработало.
источник
HREF
?Это сработало для меня:
<a href="" onclick="return false;">Action</a>
источник
В моем случае у меня было условие, когда пользователь щелкал элемент «а». Состояние было:
Если в другом разделе было больше десяти элементов, то пользователя не следует перенаправлять на другую страницу.
Если в другом разделе меньше десяти элементов, то пользователя следует перенаправить на другую страницу.
Функциональность элементов "а" зависит от другого компонента. Код в событии щелчка следующий:
var elementsOtherSection = document.querySelectorAll("#vehicle-item").length; if (elementsOtherSection> 10){ return true; }else{ event.preventDefault(); return false; }
источник