javascript:点击按钮进行POST调用

Question

我想POST通过向它添加一个事件监听器来进行按钮单击,但是使用ajax我可以进行调用但是我没有任何数据或成功,同样的错误标准.

我找到的一种方法是使用表单提交事件,但我想这不是正确的方法,我应该在点击按钮时进行POST调用.

<div id="googleSignInDiv" class="cols-row ">
   <form id="googleSignInform" action="/connect/google" method="post"
      target="google-auth-window">
      <button type="submit" class="btn-primary btn-sub-action  gss-col-12 type-300 social-button google" 
         id="signin-login-google-button" >
      <span class="icon social-icon"></span>
      <span class="btn-label">
      {{[loc-signin-google]}}
      </span>
      </button>
   </form>
</div>

如果我在我的onclick函数中执行类似这样的操作,它不能正常工作,也不会出现任何错误.

$.ajax({
    url: '/connect/google',
    type: 'POST'
});

在此之后,我有我的代码打开新窗口.如何进行一次调用并将其目标标记为google-auth-window我在代码中定义的目标？或者使用表格是正确的方法吗？

Answer 1

submit表单中类型按钮的默认行为是提交它,因此您必须首先通过使用event.preventDefault()并依次单击按钮(例如:验证等)来阻止默认行为.在您的情况下,您可以调用进行AJAX调用的函数(makeAjaxRequest).您的代码看起来像这样:

$("#signin-login-google-button").click(function(event){
  event.preventDefault();
  makeAjaxRequest();
});
function makeAjaxRequest() {
  $.ajax({
      url: '/connect/google',
      type: 'POST',
      success: function(data){
        //code to open in new window comes here
      }
  });
}

在ajax调用成功后,您可以编写代码以在新窗口中打开它.你也可以参考这个答案.