Question

我花了很多时间寻找这个，也许我没有正确接近这个，但是我在点击提交后尝试.submit和.post。在其他情况下，我已经能够在没有刷新的情况下使ajax提交正常工作，但是当我以这种方式执行时它只是不起作用。我很想知道原因。

表格

<form id="search" action="process.php" method="post">
    Name: <input id="search_text" type="text" name="name" />
    <input type="submit" value="Submit" />
</form>

的Ajax

$('#search').submit(function() {
    $.post(
      $(this).attr('action'),
      $(this).serialize(),
      function(data){
        $('#page_nav').html(data.html_page_nav);
        $('#results').html(data.table_html);
      },
      "json"
    );
    return false;
});

这样可以提交而无需重新加载就可以了。

以下是我遇到问题的地方。

在php服务器端，我发回了我希望能够提交的html，初始搜索将放入原始的html页面。

$html_page_nav = "
    <ul>
";
for($i=1; $i <= get_query_pages(get_query_count($query), 50); $i++) {
    $html_page_nav .= "
        <li>
            <form id='page_".$i."' action='process.php' method='post'>
            <input type='hidden' name='action' value='change_page'/>
            <input type='hidden' name='page' value='".$i."'/>
            <input type='submit' value='".$i."'>
            </form>
        </li>
    ";
}   
$html_page_nav .= "
    </ul>
";

我尝试做与上面相同的事情，但提交无法正常工作

            $(document).ready(function() {

                $('#page_1').submit(function() {
                    console.log("this will not display");
                    $.post(
                            $(this).attr('action'),
                            $(this).serialize(),
                            function(data){
                            },
                            "json"
                        );
                        return false;
                })
            ...other jquery
            });

此提交将无法正常运行，函数（）将不会执行，它将像常规提交一样提交并转到网址，而不是刷新整个页面而执行。

非常感谢任何建议或方法。

提前致谢！

Answer 1

委托提交操作以执行将来要加载的内容。默认情况下，正常事件处理程序附加到DOM上加载的内容，而不是将来会加载的内容，例如通过Ajax。您可以使用jQuery“on”函数来委托将来加载的内容上的操作。

例如

$('body').on('submit', '#page_1', function() {
  // do it here
});

Answer 2

我在使用ajaxForm时遇到了类似的问题。我使用了$（＆＃34;＃Form＆＃34;）。validate（）; 对于它和页面没有得到刷新

有了ajax提交重新加载的问题，匿名函数没有执行

2 个答案: