Jquery Ajax Call - 成功时的引导警报

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 调用我的错在哪里？

编辑：

尝试后，我将我的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(){
                });
            }
      });
 }