Question

我的页面中有一个表单如下：

     <form id="shipping" action="some-action-url" method="post">
        <ul>
         <li>
          <input id="ship238280" name="method" value="238280|479435" type="radio" checked="checked">
          <label for="ship238280">Transport (€0,00)</label>
         </li>
         <li>
          <input id="ship292259" name="method" value="292259|580109" type="radio">
          <label for="ship292259">Pick up (€0,00)</label>
         </li>
        </ul>
      </form>

我使用SaaS平台，因此我对脚本的访问权限有限，需要使用实际可用的内容。所以我正在寻找更多的解决方法......

在上面的表格中，我检查了第一个选项。要实际设置第一个送货选项，我必须提交表格。然后在系统中设置此选项。

所以我有一个提交表单的函数：

function sendform(){
  var loader = $('.cart-loader');
  var form = $('#shipping');

  $(loader).show()
    $.ajax({
      type: "POST",
      url: $(form).attr('action'),
      data: $(form).serialize(),
      success: function(data) { 
       $(loader).hide()
       //$(this).unbind()
      } 
    });
}

单击其中一个选项时的点击事件：

 $('#shipping input').on('click', function(){
   sendform()
 });

我现在想要的是在页面加载时提交表单。所以我创造了这样的东西：

$(function(){
  $('#shipping input').each(function(){
    if($(this).is(':checked')){
      $(this).trigger('click') // or sendform()
     }
   });
});

现在发生的是表单不断提交，因为每次页面重新加载（提交后）它都想再次提交！

我如何知道它需要首先提交以设置选项？

我在ajax成功函数中尝试了$(document).one('ready', function(){之类的内容或$(this).unbind()之类的内容。

我有点失落:)所以任何帮助都非常感谢!!

Answer 1

尝试这样的事情：https://jsfiddle.net/noidee/uvm6jw3b/

$.ajax({
  url: '/test_json',
  context: this,
//  [... etc ...]
  success: function(data) {
    this.message = "reference to Vue data message";
  }
);

加载页面时触发一次单击

1 个答案: