0

我有一个文本输入字段，旁边有一个按钮。当我单击此按钮时，我希望 alert() 向我显示输入字段的 ID。这是我的代码

<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);
        });

目标是单击新创建的字段旁边的删除按钮，并在 alert() 框中显示其 ID。那是行不通的。

4

4 回答 4

1

因为输入没有设置 id 属性，例如

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

问：为什么这不起作用？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

附言。我还会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：如果您有多个拖曳和多个删除按钮，他们需要唯一的 id 或 jq 有时会感到困惑。

于 2012-10-31T09:44:18.893 回答