0

テキスト入力フィールドがあり、その横にボタンがあります。このボタンをクリックすると、入力フィールドの ID が表示されるように alert() が必要です。これは私のコードです

<tr>
   <td>Item <?php echo $i; ?>:</td>
   <td>
       <input type="text" name="course_include_1" class="regular-text" /> <input type="button" class="button" id="DeleteItem" value="Delete Item" />
    </td>
</tr>

そして、これは私のjQueryコードです:

    $("#DeleteItem").live("click", function() {
        //$(this).parents("tr").remove();
        alert($(this).prev().attr("id"));
    });

なぜこれが機能しないのですか？

編集：新しい入力フィールドを作成する「追加」ボタンと、その横にある削除ボタンがあることを追加する必要があります。このコードは次のようになります。

$("#AddItem").live("click", function() {
            Count++;
            $('<tr><td>Item ' + Count + ':</td><td><input id="asdadad" name="course_include_' + Count + '" type="text" class="regular-text" /> <input type="button" class="button" id="DeleteItem" value="Delete Item" /></td></tr>').appendTo(TableRow);
        });

目標は、新しく作成されたフィールドの横にある削除ボタンをクリックし、その ID を alert() ボックスに表示することです。そして、それは機能していません。

4

4 に答える 4

1

入力には id 属性が設定されていないため、たとえば

<input id='myInput' type="text" name="course_include_1" class="regular-text" />
于 2012-10-31T09:17:25.247 に答える
1

Q: これが機能しないのはなぜですか? A: 入力に id 属性がありません

編集

これで、「予期しない」ブラウザの動作を引き起こす可能性のある多くの要素がid="DeleteItem"できました (たとえば、バインディングを台無しにするなど)。代わりにクラスを使用し、新しいアイテムを追加するときに行でこれを変更します。

class="button" id="DeleteItem"

これに：

class="button DeleteItem"

...そしてイベントバインディングでこれを変更します:

$("#DeleteItem").live("click", function() {

これに：

$(".DeleteItem").live("click", function() {

またはこれにも（.on()の代わりに使用することをお勧めします。ここで最初のテキスト段落.live()を参照してください）：

$(document).on('click','.DeleteItem', function() {

それは物事を解決するかもしれません

編集 2

ps。idまた、入力要素ごとに一意にすることもできます。... id="asdadad"'+Count+' ...または、追加されたすべてのアイテムで同じであると想定される場合は、クラスに移動します

于 2012-10-31T09:17:54.883 に答える
0

これを試して：

$("#DeleteItem").live("click", function() {
    alert($(this).parent().find(".regular-text").attr("id"));
});

アップデート

id問題は、重複した属性を持つ要素を追加しているためです。#DeleteItem代わりにクラスを使用するように変更します。

于 2012-10-31T09:15:46.187 に答える
0

あなたの質問に答えているわけではありませんが、これを行うと行がすべて削除されます...

<input type='button' value='delete' onclick="$(this).parents('tr').remove();" />

親（親に対して）は「検索」を行いますが<tr>、行を保持していることが見つかるまで上向きに...その後、削除すると「削除」されます。

PS: 複数のトウがあり、複数の削除ボタンがある場合は、UNIQUE id が必要であるか、jq が混乱することがあります。

于 2012-10-31T09:44:18.893 に答える