代码之家  ›  专栏  ›  技术社区  ›  dclowd9901

我不能让“return false”阻止.live()重复代码传播

  •  0
  • dclowd9901  · 技术社区  · 14 年前

    我希望设置它,以便当单击某个文本体时,弹出一个文本输入字段,用户可以在该字段中输入数据,然后单击“保存”或“取消”按钮,分别将其发送到数据库或重置值。但是,尽管使用了“return false”,但我似乎无法阻止此代码重复激活。

    我已经使用die()了,这是可行的,但我也希望能够在用户保存或取消后重新启动原始的单击事件,并且想不出一种方法使其生效。事先谢谢你的帮助。

    $('td[name]').live("click", function() {
        nameof = $(this).attr("name");
        idof = $(this).attr("id");
        valueof = $(this).html();
    
        $(this).html('<input type="text" name="' + nameof + '" value="' + valueof + '"><input type="hidden" name="id" value="' + idof + '"><span id="save">save</span> &nbsp <span id="cancel">cancel</span>');
    
        return false;   
    });
    

    更新:

    以下是我最后想到的(包括所有就地编辑代码):

    $('td[name="grouping"] span, td[name="title"] span').live('click', function() {         
        nameof = $(this).parent().attr("name");
        idof = $(this).parent().attr("id");
        valueof = $(this).html();
    
        if($("table td>span").children('input').length > 0) {} 
        else {
            if($(this).children().length > 0) {} 
            else {
                $(this).html('<input type="text" name="' + nameof + '" value="' + valueof + '"><input type="hidden" name="id" value="' + idof + '"><input type="hidden" name="originalinput" value="' + valueof + '"><span class="save">save</span> &nbsp; <span class="cancel">cancel</span>');
            }
        }
    
    });
    
    $('.cancel').live('click', function() {         
        $(this).parent().html($(this).siblings('input[name="originalinput"]').attr("value"));
    });
    
    $('.save').live('click', function() {
    
        savevalue = $(this).siblings('input[type="text"]').attr("value");
        saveid = $(this).siblings('input[name="id"]').attr("value");
        savecolumn = $(this).siblings('input[type="text"]').attr("name");
    
        $.ajax({
           type: "POST",
           url: "../php/adminajax.php",
           data: 'id=' + saveid + '&' + savecolumn + '=' + savevalue
        });
    
        $(this).parent().html(savevalue);
    });
    
    $('#saving').ajaxStart( function() {
        $(this).fadeIn(100);
    });
    
    $('#saving').ajaxStop( function() {
        $(this).fadeOut(2000);
    });
    

    我确信这比我能下载的任何东西都要麻烦,但至少我现在已经知道了Ajax编辑的基本原理。谢谢你的帮助。

    1 回复  |  直到 14 年前
        1
  •  2
  •   Agent_9191    14 年前

    看起来你基本上是在做一个就地编辑的交易。您遇到的问题是,用户的单击正在通过文本框/跨距传播回其父容器,从而再次触发单击事件。你需要过滤它,这样它就不会选择在内容中有输入的TD。沿着这条线的东西:

    $('td[name]:not(td>input)').live(...);
    

    虽然不是你所寻找的直接答案,为什么不使用一个现有的插件呢? found here 是吗?