Оно не функционирует preventDefault href

Мне хотелось бы удалять перенаправление в tag a так как, в настоящее время кликнув, открывают мне модального, но я не хочу, что я redireccione страница браузера, я попытался с preventdefault и оно я не функционирует. Я работаю с C# MVC. Смоги состоять в том, чтобы я был перегружен в какой-то другой части? или: другие решения существуют для того, чтобы не я redireccione? Как последний выбор не нравился бы мне менять это на один span или div или button.

algo.cshtml

<a id="modalAboutButton">Ir a about </a>

<div id="aboutModal" class="reveal-modal" data-reveal></div>

app.js

$(document).ready(function () {
        $(document).on('click', '#modalAboutButton', function (e) {
            e.preventDefault();
            var $modal = $('#aboutModal');
            $.get('/About/Index2', function (resp) {
                $modal.html(resp).foundation('reveal', 'open');
            });
        });
});
1
задан 25.02.2016, 22:03
3 ответа

В принципе кажется, что ты это приносишь польза, хотя я предпочел бы делать это таким:

$(function () {
    $('#modalAboutButton').on('click', function (e) {
        e.preventDefault();
        var $modal = $('#aboutModal');
        $.get('/About/Index2', function (resp) {
            $modal.html(resp).foundation('reveal', 'open');
        });
    });
});

Самое важное изменение моего кода состоит в том, чтобы делать выбор элемента это был метод on

Другие две вещи, которые ты мог бы пробовать:

  • Добавлять один href="#" в твою ссылку
  • Заменять e.preventDefault(); из-за event.stopPropagation(); (вышеупомянутого я не очень уверен)
0
ответ дан 24.11.2019, 14:48

Если ты не добавляешь свойство href к твоей ссылке, нет объекта у использования preventDefault

$(document).ready(function() {
  $(document).on('click', '#modalAboutButton', function(e) {
    e.preventDefault();
    var $modal = $('#aboutModal');
    $.get('/About/Index2', function(resp) {
      $modal.html(resp).foundation('reveal', 'open');
    });
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#!" id="modalAboutButton">Ir a about </a>

<div id="aboutModal" class="reveal-modal" data-reveal></div>
4
ответ дан 24.11.2019, 14:48

Есть способ открывать модального через один пойдите и модальный с этим пойдите ссылки. Взамен то, что ты делаешь, состоит в том, чтобы включать функциональность вслед за событием, но браузер продолжает с перенаправлением благодаря тому, что ты не останавливаешь распространение того же самого, ты можешь консультировать ответ, где я говорю о распространении событий: https://es.stackoverflow.com / в / 1781/729.

Чтобы останавливать натуральное поведение события ты должен принимать во внимание 2 вещи:

event.preventDefault (): Если этот метод будет назван, действие default события не будет включено / брошено.

event.stopPropagation (): Он предотвращает непрерывность события (bubbling) посредством дерева DOM, предотвращая, что любой другой элемент отец был сообщен.

Я рекомендую тебе читать следующий документ, который говорит о bubbling: bubbling события и JQuery - Архитектура Java.

Беря уже предыдущее, упомянутый, ты мог бы пытаться несмотря на то, что остановил бы в твоем клике распространение события.

$(document).ready(function () {
    $(document).on('click', '#modalAboutButton', function (e) {
        e.preventDefault();
        e.stopPropagation();
        var $modal = $('#aboutModal');
        $.get('/About/Index2', function (resp) {
            $modal.html(resp).foundation('reveal', 'open');
        });
    });
});
0
ответ дан 24.11.2019, 14:48