javascript - 在表单提交之外调用此函数

Question

我的表单末尾有一个提交按钮，标记如下:

<button id="sendbutton" style="margin-left:25px;" class="btn btn-large btn-primary" type="submit">Send Responses</button>

这个按钮调用这个脚本:

<script type="text/javascript">
        $(function() {
            $('form').unbind('submit').bind('submit', function(){
                $.ajax({
                    type: 'post',
                    url: 'chapter.php',
                    data: $("form").serialize(),
                    success: function() {
                        alert('Your answers have been saved.');
                    }
                });
                return false;
            });
        });

    </script>

如何在此表单结构之外创建一个将调用相同函数的按钮？

Answer 1

您可以创建任何您喜欢的按钮，即使它位于表单之外。然后，让那个按钮做同样的事情，你可以简单地做

$('#yourNewButton').click(function(){
    $('form').submit();
});

或者，为什么不将您的原始逻辑包装到它自己的函数中

function submitMyForm(){
    $.ajax({
        type: 'post',
        url: 'chapter.php',
        data: $("form").serialize(),
        success: function() {
            alert('Your answers have been saved.');
        }
    });
    return false;
 }

然后

$('#yourNewButton').click(submitMyForm);
$('form').submit(submitMyForm);