Question

我有两种在页面上使用表单的方法。当用户在输入字段中输入内容并单击提交按钮时，第一一种是标准方式。第二一个是表单会自动填写并提交，具体取决于查询字符串是否传递给页面。（www.website.com/contact?fillform=true）

一切正常，但我还需要在传递查询字符串时触发提交按钮，但目前只刷新页面。

我已经完成了PHP的一部分，我检查了变量，它们没问题。

以下是Codepen，e.preventDefault()已注释掉，因为它不适用于窗口加载

$(window).load(function() {

    // Function for submitting form 
    function submitForm(e) {

        console.log('I am in');

        e.preventDefault();
        jQuery.ajax({ 
            ... // Submit form
        })

    }

    // Normal way of submitting form, works ok
    $contactForm.on('submit', function(e) {
        submitForm(e);
    });


    // This should trigger form automatically
    if(fillFormAutomatically) {
        // Everything so far works ok
        // I just need to trigger form without page refresh but none of these works
        $submitBtn.trigger('click');
        $submitBtn.triggerHandler('click');
        $contactForm.submit(e);
        $contactForm.submit(function(e) {
            console.log(e); // nothing in console shows here
            submitForm(e);
        });
        submitForm(); // This triggers function but I can't pass event?
    }

});

Answer 1

我认为有几个问题。

.load（）在jQuery 1.8中被折旧了，所以不要使用它。请参阅：https://api.jquery.com/load-event/

其次，当你在window.ready（）上调用submitForm（）时，没有事件。因此，您尝试在undefined上调用.preventDefault（）。只需将其移动到.submit（）函数即可。

这会回答你的问题吗？

＆＃13;

  $(window).ready(function() {
    
    var $form = $("#form");
    var $submitBtn = $("#submitBtn");

    // Send form on window load
    submitForm();

    // Normal way
    $form.submit(function(e) {
      e.preventDefault();
      submitForm(e);
    });

    // Send form
    function submitForm() {
        $('#vardump').append('Sending form...');
    }
    
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" id="form">
  <input type="text" value="Somedata">
  <button id="submitBtn">Submit</button>
  
</form>

<div id="vardump"></div>

＆＃13;

如何自动触发提交表单并使用preventDefault

1 个答案: