抓住表格提交不起作用

时间:2015-01-25 18:26:49

标签: jquery html ajax html-form

我一直在试用几个样本来接收表单中的提交,但我得到的只是重新加载页面。

jQuery(document).ready(function($)
{
    var frm = $('#export-form');
    //Catch the submit
    frm.submit(function(ev) {
        console.log("Here I am")  //Not visible in Firebug
        // Prevent reload
        ev.preventDefault();

        $.ajax({
            type        : 'POST', 
            url         : 'libs/GenerateCSV.php', 
            data        : 'export', 
            success     : function (data) {
                alert('success'); // Temporary debugging, later a redirection is planned
            }
        });
    });
});

但是脚本永远不会被执行。 我试过使用onsubmit调用,但结果相同。 任何人都可以帮助我吗?

3 个答案:

答案 0 :(得分:1)

代码示例中没有任何错误。

您确定在脚本之前加载了jQuery吗?

此外,您可以将代码包装在document.ready语句中:

jQuery(document).ready(function($)
{
    // your code goes here
});

答案 1 :(得分:0)

检查您的HTML代码,我想您可能在onClick中写<input>,如下所示:

<input type="submit" value="submit" onClick="this.form.submit(); this.disabled=true; this.value='waiting ...'; ">

答案 2 :(得分:-2)

尝试这种方法

<!-- Include jQuery before this code -->
<form id="export-form" method="post" accept-charset="utf-8">
    <a id="submit-form" href="#">Start Download</a>
</form>

<script type="text/javascript">

    $(document).ready(function() {
        $("#submit-form").click(function(){
            $.ajax({
                type        : 'POST', 
                url         : 'libs/GenerateCSV.php', 
                data        : 'export',
                success     : function (data) {
                    alert('success');//Just for debugging, later a redirection to a file is planned 
                }
            });
        });
    });
</script>

锚标记不会自动提交您的表单并重定向您。我总是使用此解决方案提交表单而无需重定向。您可以在成功事件重定向到任何您想要的地方。希望它会对你有所帮助。