jQuery Ajax调用-成功时的Bootstrap警报

Question

我正在尝试在提交操作结束时在表单上显示警报。

我的js函数：

    function submitForm(){

    // Initiate Variables With Form Content
    var nomeCompleto = $("#nomeCompleto").val();
    var email    = $("#email").val();
    var telefono = $("#telefono").val();
    var username = $("#username").val();
    var password = $("#password").val();
    var parametros = {
                  "nomeCompleto" : name,
                  "email"        : email

          };

          $.ajax({
                type: "POST",
                url: "adminRegistro.php",
                data: parametros,
                async:false,
                success: function(result){
                  var parsedData = JSON.parse(result);

                    $("#ajax-alert").addClass("alert alert-danger").text(parsedData.msg);
                    $("#ajax-alert").alert();
                    $("#ajax-alert").fadeTo(5000, 5000).slideUp(5000, function(){
                    });
                }
          });
}

成功触发时会调用警报，但警报仅显示很短的时间（重新加载页面时）。 使用ajax调用的myn故障在哪里？

编辑：

尝试后，我将html按钮代码从以下位置更改：

<input class="btn btn-success submit-button" value="Submit"  onclick="myFunction()"/></input>
<input class="btn btn-success submit-button" value="Submit"  id=  "btnSubmit"/></input>

和js：

$(document).ready(function (){

     $("#btnSubmit").click(function(){
     ....

而且效果很好。 使用$("#btnSubmit").click(function(e){ e.preventDefault();似乎没有效果。

Answer 1

您需要preventDefault() 。 preventDefault()方法将取消事件（如果可取消），这意味着不会发生属于该事件的默认操作。

尝试以下代码：

function submitForm(e){

    e.preventDefault(); //This will stop from reloading
// Initiate Variables With Form Content
    var nomeCompleto = $("#nomeCompleto").val();
    var email    = $("#email").val();
    var telefono = $("#telefono").val();
    var username = $("#username").val();
    var password = $("#password").val();
    var parametros = {
              "nomeCompleto" : name,
              "email"        : email

      };

      $.ajax({
            type: "POST",
            url: "adminRegistro.php",
            data: parametros,
            async:false,
            dataType: 'json',
            success: function(parsedData){
                $("#ajax-alert").addClass("alert alert-danger").text(parsedData.msg);
                $("#ajax-alert").alert();
                $("#ajax-alert").fadeTo(5000, 5000).slideUp(5000, function(){
                });
            }
      });
 }