javascript - 即使在e.preventDefault()jQuery之后，页面也会刷新

This question already has answers here:

Prevent multiple click events firing JQuery

(2个答案)


3年前关闭。

$('#btn-add-skills').on('click', function(e) {
        e.preventDefault();
        // function call goes here
    });

即使在调用e.preventDefault()之后，单击按钮仍会刷新页面。
有什么建议我可能会错过吗？

以下是上面单击功能的JADE代码。

.modal-add-skills.modal.fade
  .modal-dialog
    .modal-content
      .modal-header
        h4(style='color: black !important;')
      .modal-body
        form#addSkills
          .form-group
            label.col-form-label(for='Skill') Skill
            input#skill_input.form-control.required(type='text', name='Skill', placeholder='Start typing to select skill', style="width: 300px;")
          .modal-footer
            button#add-skill-data.btn.btn-primary(type='submit') Add

最佳答案

您可能还需要添加 e.stopPropagation(); 以阻止事件冒泡DOM树。

$(document).ready(function(){
    $('#btn-add-skills').on('click', function(e) {
        e.preventDefault();
        e.stopPropagation();

        alert("Stopped Redirecting");

        // function call goes here

        return false;
  });
});

Demo