jQuery允许通过以下任一方式以编程方式触发表单提交:

  • $('.js-form-class-hook').submit();
  • $('.js-form-class-hook').trigger('submit');


  • 注意:我的理解是.trigger('submit').submit().on('submit',function(e){});.submit(function(e){});。简而言之,.trigger('submit')是一种比.submit()以编程方式提交表单的功能更强大的方法。

    我已经知道.on('submit',function(e){});.submit(function(e){});之间的一些区别,请参阅我对What's the difference between $(form).submit and $(form).on("submit") in jQuery?的回答,我现在想更好地了解.trigger('submit')的作用。

    我的结论是:经过一番研究,我发现使用.trigger('submit')似乎提供了允许传递任意数据的“唯一”(尽管非常强大)优势。

    用法示例1:

    例如,这可以用于区分“人性”与“程序化”表单提交。

    jsbin.com/jivexawixonu/1/edit?html,js,console,output上观看实时演示(单击右上角的“运行/清除”)

    的HTML
    <form class="js-form-hook-xyz">
       <button>Submit form</button>
    </form>
    

    jQuery的
    var pleaseConfirmSubmission = function( formElem ){
      // ... some conditions checks
      // if condition met, submit with a flag
      formElem.trigger( "submit" , ['isProgrammaticalSubmission'] );
    }
    
    
    $("body").on("submit", ".js-form-hook-xyz", function(event, isProgrammaticalSubmission) {
      console.log("on form submission: " +  ( isProgrammaticalSubmission || "isHumanAction !" ) );
      if ( !isProgrammaticalSubmission ){ /* JS truthy/falsy value usage */
        event.preventDefault(); /* cancel form submission */
        pleaseConfirmSubmission( $(this) );
      }
    });
    

    资源:
  • api.jquery.com/submit
  • api.jquery.com/trigger
  • api.jquery.com/on
  • www.inkling.com/read/jquery-cookbook-cody-lindley-1st/chapter-8/recipe-8-5


  • 我错过了.trigger('submit')提供的其他功能吗?

    还是“允许传递任意数据”是使用.trigger('submit')的唯一优势?

    最佳答案

    不带参数的submit()trigger('submit')之间基本上没有区别,实际上不带参数的submit()最终仍将返回trigger()

    您可以通过查看jQuery Source来证明这一点:

    jQuery.fn.submit()

    function (data, fn) {
        return arguments.length > 0 ? this.on(name, null, data, fn) : this.trigger(name);
    }
    

    因此,如果将参数传递给submit(),则将调用.on('submit'...,否则将调用.trigger('submit')
    submit()是调用trigger('submit')的更容易理解的方式。两者都没有特殊功能,您可以选择个人喜好。

    注意: click() change() 等也是如此。



    除非您认为减少一个函数调用的好处,否则是的。

    07-24 09:48
    查看更多