0

.toggle()使用している機能に問題があります。PHP を使用してデータベースから結果を取得し、テーブルに情報を入力しています。表の各行の最後の項目はリンクで、クリックすると、管理者がその製品の情報を編集できる別の行が表示されます。リンクのクラスは.edit_prodここにあります私のjQueryメソッドです:

$(function() {
$(".edit_prod").click(function() {
 $("#mydiv").toggle();
      return false;
     });
 });

誰かが間違っている可能性があることについて私を助けることができますか?

ありがとう!

アップデート:

HTMLを作成するPHPコードは次のとおりです

$table_format = sprintf("
        <tr>
            <td>
                <img src='%s' id='edit_img_pic' />
            </td>
            <td>
                %s
            </td>
            <td>
                %s
            </td>
            <td>
                <a class='edit_prod' href='#'>Edit</a>  
            </td>



        </tr>
        <tr id='mydiv' style='display: none' cellspacing='20px'>
            <form action='edit_product.php' method='post'>
            <td>
                <label for='name'>Product Name</label><br>
                <input type='text' name='name' value='%s' /><br><br>
            </td>
            <td>
                <label for='sku'>SKU</label><br>
                <input type='text' name='sku' value='%s' /><br><br>
            </td>
            <td>
                <label for='price'>Price</label><br>
                $<input type='text' name='price' value='%s' /><br><br>
            </td>
            <td>
                <label for='desc'>Description</label><br>
                <textarea cols='40' rows='7' name='desc'></textarea><br><br>
                <input type='submit' value='Save' />
            </form>
        <tr>
        ", $img, $prod_name, $sku, $prod_name, $sku, $price);

        echo $table_format;

更新 2:

4

2 に答える 2

2

あなたの最後の言葉によると

表の各行はリンクであり、クリックすると、管理者が情報を編集できる別の行が表示されます

あなたは動的にあなたのhtmlに要素をロードしているようdocument.Ready()です..

jQuery には、動的に読み込まれる DOM 要素にクリック イベントをアタッチするために使用できる "on" API があります。

編集 @rockerest のおかげで.. の使用live()から変更されon()、@Sly_cardinal に従って修正されました。

そのようなことを試してください:

$(function() {
    $("table").on("click", ".edit_prod", function() {
        $("#mydiv").toggle();
        return false;
    });
});

API ドキュメントの jQuery

于 2013-01-29T03:29:26.693 に答える
1

@Mortalus: 投稿した構文は、通常のダイレクト イベント リスナー (委任されたイベントではない) 用です。

委任されたイベント リスナーの構文には、イベント名とイベント ハンドラーの間に追加のセレクター文字列があります (例として Matt のコードを使用)。

$(function() {
    $("table").on("click", ".edit_prod", function() {
        $("#mydiv").toggle();
        return false;
    });
});

これは、.edit_prod内の要素tableがクリックされるたびに、そのイベント ハンドラーが呼び出されることを意味します (後でさらに.edit_prod要素が DOM に追加された場合でも)。

于 2013-01-29T04:41:43.810 に答える