0

特定のテキスト本文をクリックすると、テキスト入力フィールドがポップアップし、ユーザーがフィールドにデータを入力してから、「保存」または「キャンセル」ボタンをクリックして送信できるように設定したいそれぞれデータベースに入れるか、値をリセットします。ただし、「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 のインプレース編集の基本を知っています。助けてくれてありがとう。

4

1 に答える 1

2

基本的に、その場での編集取引を行おうとしているようです。発生している問題は、ユーザーのクリックがテキスト ボックス/スパンを介して親コンテナーに伝播され、クリック イベントが再度トリガーされることです。コンテンツ内に入力があるtdを選択しないように、フィルタリングする必要があります。これに沿った何か：

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

あなたが探しているものへの直接的な答えではありませんが、ここにあるような既存のプラグインを使用しないのはなぜですか?

于 2010-02-11T13:10:44.820 に答える