Question

用户点击提交按钮并将数据发送到浏览器后，我希望该按钮被禁用和更改。我已经尝试过自己的工作。但它不起作用

$(document).ready(function(){
    $("form").on('submit',function(event){ 
        event.preventDefault();

        data = $(this).serialize();

        $.ajax({
        type: "POST",
        url: "calls/insert_fryd.asp",
        data: data
        }).success(function() {


             $(".btn-style").click(function(){
        $(this).val('Inserted');
        $(this).attr('disabled', 'disabled');
  });

Answer 1

我认为这就是你所需要的：

$(document).ready(function(){
    $("form").on('submit',function(event){ 
        event.preventDefault();

        data = $(this).serialize();

        $.ajax({
        type: "POST",
        url: "calls/insert_fryd.asp",
        data: data
        }).success(function() {
            $(".btn-style").val('Inserted').attr('disabled', 'disabled');
        });
    });
});

Answer 2

试试这个

$(document).ready(function() {
  $("form").on('submit', function(event) {
    event.preventDefault();

    data = $(this).serialize();

    $.ajax({
      type: "POST",
      url: "calls/insert_fryd.asp",
      beforeSend: function() {
        $(".btn-style").val('Loading').attr('disabled', 'disabled');
      },
      data: data
    }).success(function() {


      $(".btn-style").val('Inserted');
    })
  });
});

Answer 3

您应该删除点击事件的代码，如下所示：

$(document).ready(function(){
    $("form").on('submit',function(event){ 
        event.preventDefault();

        data = $(this).serialize();

        $.ajax({
            type: "POST",
            url: "calls/insert_fryd.asp",
            data: data
        }).success(function() {
            $('.btn-style').val('Inserted').attr('disabled', 'disabled');
        });
    });
});

成功插入后更改按钮名称

3 个答案: