Stworzę tam trzy funkcje. Myślę o tym, że jest krótszy lub łączy się w jedną funkcję. Czy to możliwe?
Oto mój kod!

$(function(){
   $(".js-disable-form").on("submit", function() {
     $('#loading-modal').modal('show');
     $(this).find("input[type=submit]").prop('disabled', true);
   })
});

$(function(){
  $(".js-disable-form-approval").on("submit", function() { 
    var res = confirm("入力内容で承認します。よろしいですか?");
    if (res == true) {
      $('#loading-modal').modal('show');
      $(this).find("input[type=submit]").prop('disabled', true);
    } else {
     return false;
      }
    })
});

$(function(){
  $(".js-disable-form-individual").on("submit", function() {
    $(this).find("input[type=submit]").prop('disabled', true);
  })
  $('.js-disable-btn').on("click", function() { 
    $('#loading-modal').modal('show');
  })  
}); 
-1
JiaPing 26 czerwiec 2017, 10:19

3 odpowiedzi

Najlepsza odpowiedź

To powinno wystarczyć:

function showModal() { $('#loading-modal').modal('show'); }

function disableSubmit() { $(".js-disable-form input[type=submit]").prop('disabled', true); }

$(function() {
  $(".js-disable-form").on("submit", function() {
    showModal();
    disableSubmit();
  });

  $(".js-disable-form-approval").on("submit", function() {
    if (confirm("入力内容で承認します。よろしいですか?")) {
      showModal();
      disableSubmit();
    } else return false;
  });

  $(".js-disable-form-individual").on("submit", disableSubmit);
  $('.js-disable-btn').on("click", showModal);
});

To nie jest znacznie krótsze niż oryginalny kod, ale powinien pokazać, jak uniknąć duplikatu ogólnego kodu.

1
Chris G 26 czerwiec 2017, 07:42
$('[class^=".js-disable-"').on("submit", function(){
    if ($(this).className.indexOf("individual") >= 0 || $(this).className.indexOf("form") >=0){
        $(this).find("input[type=submit]").prop('disabled', true);  
        if ($(this).className.indexOf("individual") >= 0 ){     
            $('.js-disable-btn').on("click", function() { 
                $('#loading-modal').modal('show');
            })  
        }
        else{
            $('#loading-modal').modal('show');
        }
    }  
    else { 
        var res = confirm("入力内容で承認します。よろしいですか?");
        if (res == true) {
            $('#loading-modal').modal('show');
            $(this).find("input[type=submit]").prop('disabled', true);
        } 
        else {
            return false;
        }
    }
});

Nie testowałem, ponieważ nie ma podłączenia HTML. Zasadniczo pasuje do klas, które rozpoczynają się od wyłączania .js - i dołącza zdarzenie przesyłania. Potem po prostu przerażające twoje funkcje.

0
user5014677 26 czerwiec 2017, 07:54

Możesz przynajmniej umieścić wszystkie oferty obsługi zdarzeń w jedną funkcję:

$(function(){
    $(".js-disable-form").on("submit", function() {
        $('#loading-modal').modal('show');
        $(this).find("input[type=submit]").prop('disabled', true);
    })

    $(".js-disable-form-approval").on("submit", function() { 
        var res = confirm("入力内容で承認します。よろしいですか?");
        if (res == true) {
            $('#loading-modal').modal('show');
            $(this).find("input[type=submit]").prop('disabled', true);
        } else {
            return false;
        }
    })

    $(".js-disable-form-individual").on("submit", function() {
        $(this).find("input[type=submit]").prop('disabled', true);
    })

    $('.js-disable-btn').on("click", function() { 
        $('#loading-modal').modal('show');
    })  
}); 
0
ush189 26 czerwiec 2017, 07:32