Как использовать ссылку для вызова JavaScript?
Как использовать ссылку для вызова кода JavaScript?
11 ответов
<a onclick="jsfunction()" href="#">
или же
<a onclick="jsfunction()" href="javascript:void(0);">
Редактировать:
Приведенный выше ответ на самом деле не является хорошим решением, так как я многое узнал о JS с тех пор, как я впервые написал. Посмотрите ответ EndangeredMassa ниже для лучшего подхода к решению этой проблемы.
Ненавязчивый JavaScript, нет зависимости от библиотеки:
<html>
<head>
<script type="text/javascript">
// Wait for the page to load first
window.onload = function() {
//Get a reference to the link on the page
// with an id of "mylink"
var a = document.getElementById("mylink");
//Set code to run when the link is clicked
// by assigning a function to "onclick"
a.onclick = function() {
// Your code here...
//If you don't want the link to actually
// redirect the browser to another page,
// "google.com" in our example here, then
// return false at the end of this block.
// Note that this also prevents event bubbling,
// which is probably what we want here, but won't
// always be the case.
return false;
}
}
</script>
</head>
<body>
<a id="mylink" href="http://www.google.com">linky</a>
</body>
</html>
<a href="javascript:alert('Hello!');">Clicky</a>
РЕДАКТИРОВАТЬ, годы спустя: НЕТ! Никогда не делай этого! Я был молод и глуп!
И почему бы не ненавязчиво с JQuery:
$(function() {
$("#unobtrusive").click(function(e) {
e.preventDefault(); // if desired...
// other methods to call...
});
});
HTML
<a id="unobtrusive" href="http://jquery.com">jquery</a>
Ненавязчивый Javascript имеет много преимуществ, вот шаги, которые он предпринимает, и почему это хорошо использовать.
ссылка загружается как обычно:
это важно, потому что это будет работать для браузеров с отключенным javascript или если в коде javascript есть ошибка, которая не работает.
JavaScript запускается при загрузке страницы:
window.onload = function(){ document.getElementById("DaLink").onclick = function(){ if(funcitonToCall()){ // most important step in this whole process return false; } } }если javascript работает успешно, возможно, загружая содержимое текущей страницы с помощью javascript, возвращаемое значение false отменяет срабатывание ссылки. другими словами, установка return false приводит к отключению ссылки, если JavaScript успешно работал. Позволяя ему работать, если javascript этого не делает, вы делаете хорошую резервную копию, чтобы ваш контент отображался в любом случае, для поисковых систем, и если ваш код ломается, или просматривается в не-javascript системе.
Лучшая книга на эту тему - "Дом сценариев" Джереми Кейта
Я думаю, что вы можете использовать onclick событие, как то так:
<a onclick="jsFunction();">
Или, если вы используете PrototypeJS
<script type="text/javascript>
Event.observe( $('thelink'), 'click', function(event) {
//do stuff
Event.stop(event);
}
</script>
<a href="#" id="thelink">This is the link</a>
Вы можете использовать кнопку и оформить ее как ссылку: HTML-код:
На основе использования ответа @mister_lucky с jquery:
$('#unobtrusive').on('click',function (e) {
e.preventDefault(); //optional
//some code
});
HTML-код:
<a id="unobtrusive" href="http://jquery.com">jquery</a>
Почему бы просто не сделать это кнопкой и оформить как ссылку?
<button onclick = 'myFunction()' style='background-color: white; border: none; color: blue'>I look like a link</button>
Просто используйте JavaScript:---- пример
javascript:var JFL_81371678974472 = new JotformFeedback({ formId: '81371678974472', base: 'https://form.jotform.me/', windowTitle: 'Photobook Series', background: '#e44c2a', fontColor: '#FFFFFF', type: 'false', height: 700, width: 500, openOnLoad: true })