Javascript-форум (https://javascript.ru/forum/)
-   Ваши сайты и скрипты (https://javascript.ru/forum/project/)
-   -   event.preventdefault() не работает (https://javascript.ru/forum/project/68267-event-preventdefault-ne-rabotaet.html)

KennyMorkovka 05.04.2017 19:39
event.preventdefault() не работает
 
Объясните пожалуйста почему браузер переходит по ссылке вместо того чтобы заменять src на href?
$(document).ready(function () {
$("#small a").click(function(event) {
$("#big img").hide().attr("src",$(this).attr("href"));
$("#big img").load(function() {
$(this).fadeIn(2000);
});
event.preventDefault();
});
});

рони 05.04.2017 20:02
KennyMorkovka,
потому что код с ошибками, а значит не рабочий

KennyMorkovka 05.04.2017 21:07
Где ошибки?

KennyMorkovka 05.04.2017 21:11
ошибки есть attr но погоды это не меняет, preventdefault все равно не работает

рони 05.04.2017 21:47
KennyMorkovka,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <script>
$(function() {
$("#big img").on("load", function() {
            $(this).fadeIn(2E3)
        });
$("#small a").click(function(event) {
        event.preventDefault();
        $("#big img").hide().attr("src", $(this).attr("href"))
    })
});
  </script>
</head>

<body  id="small">
<a href="https://www.w3schools.com/howto/img_fjords.jpg">click</a>
<a href="http://bigtiger.ru/sites/default/files/styles/697x340_new_slider/public/offer/shutterstock_56606173.jpg">click</a>
<!-- The Modal -->
<div id="big" class="modal">

  <img class="modal-content" id="img01">

</div>

</body>
</html>

KennyMorkovka 06.04.2017 16:52
Спасибо

KennyMorkovka 06.04.2017 16:55
Цитата:
Сообщение от рони (Сообщение 449360)
KennyMorkovka,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <script>
$(function() {
$("#big img").on("load", function() {
            $(this).fadeIn(2E3)
        });
$("#small a").click(function(event) {
        event.preventDefault();
        $("#big img").hide().attr("src", $(this).attr("href"))
    })
});
  </script>
</head>

<body  id="small">
<a href="https://www.w3schools.com/howto/img_fjords.jpg">click</a>
<a href="http://bigtiger.ru/sites/default/files/styles/697x340_new_slider/public/offer/shutterstock_56606173.jpg">click</a>
<!-- The Modal -->
<div id="big" class="modal">

  <img class="modal-content" id="img01">

</div>

</body>
</html>
Спасибо. Сейчас скрипт работает, буду разбираться


Часовой пояс GMT +3, время: 20:35.