Jquery 提交after()表单不使用Ajax

Jquery 提交after()表单不使用Ajax,jquery,ajaxform,Jquery,Ajaxform,周末的东西。我正在使用ajaxForm插件,它运行良好。但是使用after()创建的表单通常只提交到url,并发布ajax $("a.update-time").live("click", function(event) { event.preventDefault(); var row = $(this).attr("id").split('-'); $("#update-mini-form").remove();

周末的东西。我正在使用ajaxForm插件,它运行良好。但是使用after()创建的表单通常只提交到url,并发布ajax

$("a.update-time").live("click", function(event) {

            event.preventDefault(); 
            var row = $(this).attr("id").split('-');

            $("#update-mini-form").remove();

            $(this).after(
                '<div id="update-mini-form"><form method="post" action="' + 'http://drupal.se/timetracker/timetracker/update_time/' + row[1] + '"> ' +
                '<input type="textfield" name="title" value="">' +
                '<input type="textfield" name="event_date" value="">' +
                '<input type="textfield" name="hours" size="2" value="">' +
                '<input type="submit" value="update">' +
                '</form></div>'                 
                );
        });

        $('#update-mini-form').live("submit", function(){

                var row = $(this).closest('a').attr("id").split('-');
                $(this).ajaxForm({
                        url: 'http://drupal.se/timetracker/timetracker/update_time/' + row[1],
                        target:$("div#row-" + row[1]),
                        type: "POST",
                });

        });
$(“a.update-time”).live(“单击”),函数(事件){
event.preventDefault();
var行=$(this.attr(“id”).split('-');
$(“#更新小表单”).remove();
美元(本)。之后(
' ' +
'' +
'' +
'' +
'' +
''                 
);
});
$(“#更新小表单”).live(“提交”,函数(){
var row=$(this.nexist('a').attr(“id”).split('-');
$(此).ajaxForm({
网址:'http://drupal.se/timetracker/timetracker/update_time/“+第[1]行,
目标:$(“第行-”+第[1]行),
类型:“POST”,
});
});

如果我理解正确,.live()通过将委托处理程序绑定到文档元素并侦听冒泡事件来工作,对吗?正如Vishal和Poelinca Dorin所指出的,您应该在jQuery的当前版本中使用.on()

我认为您的问题可能是因为您的迷你表单提交处理程序没有阻止默认提交的发生。试试这个:

$("a.update-time").live("click", function(event) {
    event.preventDefault(); 
    var row = $(this).attr("id").split('-');

    $("#update-mini-form").remove();

    $(this).after(
        '<div id="update-mini-form"><form method="post" action="' + 'http://drupal.se/timetracker/timetracker/update_time/' + row[1] + '"> ' +
        '<input type="textfield" name="title" value="">' +
        '<input type="textfield" name="event_date" value="">' +
        '<input type="textfield" name="hours" size="2" value="">' +
        '<input type="submit" value="update">' +
        '</form></div>'                 
        );
});

// Note: You should probably replace $(document) with a more specific container element
$(document).on("submit", "#update-mini-form", function(event){
    event.preventDefault();
    var row = $(this).closest('a').attr("id").split('-');
    $(this).ajaxForm({
        url: 'http://drupal.se/timetracker/timetracker/update_time/' + row[1],
        target:$("div#row-" + row[1]),
        type: "POST",
    });

});
$(“a.update-time”).live(“单击”),函数(事件){
event.preventDefault();
var行=$(this.attr(“id”).split('-');
$(“#更新小表单”).remove();
美元(本)。之后(
' ' +
'' +
'' +
'' +
'' +
''                 
);
});
//注意:您可能应该用更具体的容器元素替换$(document)
$(文档)。在“提交”、“更新小表单”功能(事件)上{
event.preventDefault();
var row=$(this.nexist('a').attr(“id”).split('-');
$(此).ajaxForm({
网址:'http://drupal.se/timetracker/timetracker/update_time/“+第[1]行,
目标:$(“第行-”+第[1]行),
类型:“POST”,
});
});

好的,我已经开始工作了。我建议使用单一表单,但live()仍然是必需的。我猜是因为当你用JS移动/复制某些东西时,它仍然不是页面的一部分。我也有选择错误,但修复没有帮助。移动表单也会杀死最近的对象,而live()对此没有帮助。所以我不得不改变系统,把身份证放在表格里。这就是我使用的:

php:


离题:为什么你不只拥有一个表单,并将其四处移动,而不是删除并重新创建它?这样,您就不需要向live注册submit事件。另外一种委派事件的正确方法是使用on()not live。您使用的jQuery版本是什么
live()
从jQuery 1.7开始就停止销售。@poelinca,我首先想到了这一点,但遭到了coders的阻挠。今天过得很愉快。我会在早上试一试。这是在Drupal7中,所以最高版本是1.4.4。令人沮丧,但我现在无能为力。当然,使用$(document)并没有效率——应该用container元素替换它以提高性能。因为我对你的HTML不太了解,所以我现在就把它放在这里,这样你就可以看看它是否修复了你的“AJAX不工作”问题,然后从那里改进它。
$output .=  '<div><form method="post" style="display:none" id="update-mini-form" action="' . 'http://drupal.se/timetracker/timetracker/update_time">' .
                '<input type="textfield" name="title" value="">' .
                '<input type="textfield" name="event_date" value="">' .
                '<input type="hidden" name="id_mini_form" id="id-mini-form" value="">' .
                '<input type="textfield" name="hours" size="2" value="">' .
                '<input type="button" id="sendUpdate" value="update">' .
                '</form></div>';                
    //$output .= '<pre>' .print_r($all, 1) . '</pre>'; 
    print $output;
$("a.update-time").live("click", function(event) {

            event.preventDefault(); 
            var row = $(this).attr("id").split('-');

            $("#id-mini-form").val(row[1]);

            $(this).after($("#update-mini-form").show());


        });

        $("#sendUpdate").live("click",function() {          
            $.ajax({
                        type: "POST",
                        url: "http://drupal.se/timetracker/timetracker/update_time/",
                        data: $('#update-mini-form').serialize(),
                        cache: false,
                        success: function(result){

                            $("#update-mini-form").hide();
                            alert(result);
                        }
            });

            return false;           

        });