[Load（）在提交表单时无法调用PHP模板

Question

我正在尝试在提交表单时将php文件加载到div中。目前，所有事件都触发此行$('#signupform').load('newsletter-signup-call.php');，我在那里只有一个简单的回显请求，但它没有触发。如果我转到该模板，则可以使用。

我要去哪里错了？我可以触发两个Ajax调用（因为它本身可以工作），但是load似乎有问题。

  <script>
    $("#signupForm").submit(function(e) {
        e.preventDefault();
        var form = $(this);
        var email = $("#EmailAddress").val();

        $.ajax({
               type: "POST",
               url: form.attr('action') + '?email=' + email,
               data: form.serialize(),
               beforeSend: function(){
                 $(".newsletter-loading").show().css({"display":"inline-block"});
               },
               success: function(data)
               {
                   console.log(data); //data contain response from your php script
                   register_signup();
                   register_prefs();

                   (function() {
                       window.sib = {
                           equeue: [],
                           client_key: "xxx"
                       };
                       /* OPTIONAL: email for identify request*/
                       window.sib.email_id = email;
                       window.sendinblue = {};
                       for (var j = ['track', 'identify', 'trackLink', 'page'], i = 0; i < j.length; i++) {
                       (function(k) {
                           window.sendinblue[k] = function() {
                               var arg = Array.prototype.slice.call(arguments);
                               (window.sib[k] || function() {
                                       var t = {};
                                       t[k] = arg;
                                       window.sib.equeue.push(t);
                                   })(arg[0], arg[1], arg[2]);
                               };
                           })(j[i]);
                       }
                       var n = document.createElement("script"),
                           i = document.getElementsByTagName("script")[0];
                       n.type = "text/javascript", n.id = "sendinblue-js", n.async = !0, n.src = "https://sibautomation.com/sa.js?key=" + window.sib.client_key, i.parentNode.insertBefore(n, i), window.sendinblue.page();
                   })();

                   sendinblue.track('marketing');
                   $(".newsletter-loading").hide();
                   form.replaceWith("<br /><p>Thanks for signing up! You'll receive an email with your discount.</p>");
               }
             });

    });
    function register_prefs(){
      var email = $("#EmailAddress").val();
      Cookies.set('Address', email, { expires: 100000 });
      $('#signupform').load('newsletter-signup-call.php');
    }

    function register_signup(){
      ga( 'send', 'event', 'Newsletter Sign Up', 'submit' );
    }
  </script>

Answer 1

尝试console.log响应状态以查看发生了什么问题

function register_prefs(){

    //see if this function is triggered 
    console.log('register_prefs function triggered')

    var email = $("#EmailAddress").val();
    Cookies.set('Address', email, { expires: 100000 });

    $('#signupform').load('newsletter-signup-call.php', function( response, status, xhr ){
        console.log('Server response : ', response)//The serve response
        console.log('Status Message : ', [xhr.status, xhr.statusText])//See the status of your request, if any error it should be displayed here
    });
}

但是，为什么要执行另一个带有负载的服务器调用，当您已经在使用ajax时，您可以在json对象{Mydata: ..., MyHTML: ...}中的第一次调用中返回html，并且在成功时仅使用$('#signupform').html(data.MyHTML)。

另外，不确定，但我怀疑URL格式错误，请尝试改用'/newsletter-signup-call.php'或绝对路径来确定。