Odpowiedzi:
<a onclick="jsfunction()" href="#">lub
<a onclick="jsfunction()" href="javascript:void(0);">Edytować:
Powyższa odpowiedź nie jest dobrym rozwiązaniem, ponieważ wiele nauczyłem się o JS od czasu, gdy opublikowałem. Zobacz odpowiedź EndangeredMassa poniżej, aby uzyskać lepsze podejście do rozwiązania tego problemu.
Dyskretny JavaScript, brak zależności od biblioteki:
<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>hrefjeśli nie chcę przekierowywać użytkownika i po prostu chcę uruchomić jakiś kod? Edit: widzę, że może ona być pusta: href="".
onclickwydarzenie przez window.onload, niż umieszczać onclickbezpośrednio w <a>tagu?
<a href="javascript:alert('Hello!');">Clicky</a>EDYCJA, lata później: NIE! Nigdy tego nie rób! Byłem młody i głupi!
Edytuj ponownie: kilka osób zapytało, dlaczego nie powinieneś tego robić. Jest kilka powodów:
Prezentacja: HTML powinien skupiać się na prezentacji. Umieszczenie JS w HREF oznacza, że Twój HTML zajmuje się teraz w pewnym sensie logiką biznesową.
Bezpieczeństwo: JavaScript w kodzie HTML narusza zasady bezpieczeństwa treści (CSP) . Polityka bezpieczeństwa treści (CSP) to dodatkowa warstwa zabezpieczeń, która pomaga wykrywać i łagodzić niektóre typy ataków, w tym ataki typu Cross-Site Scripting (XSS) i ataki polegające na wstrzykiwaniu danych. Ataki te są wykorzystywane do wszystkiego, od kradzieży danych po niszczenie witryn lub dystrybucję złośliwego oprogramowania. Przeczytaj więcej tutaj .
Dostępność: znaczniki kotwicy służą do łączenia z innymi dokumentami / stronami / zasobami. Jeśli Twój link nigdzie nie prowadzi, powinien to być przycisk . Dzięki temu czytniki ekranu, terminale brajlowskie itp. Mogą znacznie łatwiej określić, co się dzieje, i przekazać przydatne informacje użytkownikom niedowidzącym.
href='#'i alert()w onclickśrodku?
I dlaczego nie dyskretnie z jQuery:
$(function() {
$("#unobtrusive").click(function(e) {
e.preventDefault(); // if desired...
// other methods to call...
});
});HTML
<a id="unobtrusive" href="http://jquery.com">jquery</a>Dyskretny Javascript ma wiele zalet, oto kroki, które należy wykonać i dlaczego warto go używać.
łącze ładuje się normalnie:
<a id="DaLink" href="http://host/toAnewPage.html"> kliknij tutaj </a>
jest to ważne, ponieważ będzie działać w przeglądarkach z wyłączoną obsługą JavaScript lub jeśli w kodzie javascript jest błąd, który nie działa.
javascript uruchamia się po załadowaniu strony:
window.onload = function(){
document.getElementById("DaLink").onclick = function(){
if(funcitonToCall()){
// most important step in this whole process
return false;
}
}
}jeśli javascript uruchomi się pomyślnie, być może załadowanie treści na bieżącej stronie za pomocą javascript, zwrot false anuluje uruchomienie linku. innymi słowy, ustawienie return false skutkuje wyłączeniem linku, jeśli javascript został pomyślnie uruchomiony. Pozwalając mu działać, jeśli nie działa javascript, robiąc ładną kopię zapasową, aby treść była wyświetlana w obie strony, dla wyszukiwarek i jeśli twój kod się zepsuje lub jest wyświetlany w systemie innym niż javascript.
najlepszą książką na ten temat jest „Dom Scription” Jeremy'ego Keitha
Lub, jeśli używasz 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>w oparciu o @mister_lucky answer użyj z jquery:
$('#unobtrusive').on('click',function (e) {
e.preventDefault(); //optional
//some code
});Kod HTML:
<a id="unobtrusive" href="http://jquery.com">jquery</a>po prostu użyj javascript: ---- exemplale
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 })