0

我有一个不是强类型的部分视图。它是动态的：

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>

<%@ Import Namespace="Student.Models" %>

<div>
<table id="TA">
        <tr>
            <th>Teaching Assistant</th>
            <th>Course ID</th>
            <th>Day</th>
            <th>Delete Row</th>
        </tr>
</table>
</div>

<div>
<table id="StudentAction">
    <tr>
       <td><select name="TeachingAssistant"></select> </td>
       <td><select name="CourseID"></select></td>
       <td><select name="Day"></select></td>
       <td><input name="delete" type="image" src="/delete.png"  onclick="javascript:delete('this')"/></td>
   </tr>

</table>
</div>

现在，每次从“TeachingAssistant”选择列表中选择一个新值时，我都会使用 JQuery 添加一个新行。

此外，还有一个删除图像，单击时应删除该特定行。如何根据单击的删除图像识别特定行？例如，如果单击第三行的删除图像，那么我如何识别第三行并将其发送到 JQuery？例如，我想识别单击删除图像的行并将其发送到下面 JQuery 中的删除函数，使用“this”不起作用，还有其他方法吗？这又不是一个强类型视图，它是动态的。

function delete(val) {

    $(this).parent().remove();

}

任何帮助，将不胜感激。

4

2 回答 2

1

添加一些类来触发事件。

<td><input name="delete" type="image" src="/delete.png" class="delete"/></td>

然后使用closest获取它的行。

$('#StudentAction').on('click', '.delete', function() {
    $(this).closest('tr').remove();
});

演示

或旧版本：

$('#StudentAction .delete').live('click', function() {
    $(this).closest('tr').remove();
});
于 2012-08-07T23:54:45.433 回答
0

如果 deleteThis 函数与您的表在同一个 html 页面中定义。然后以下应该工作。

/* This will send the table row to deleteThis function */
<td>
    <input type =".." onclick="javascript:deleteRow($(this).parent().parent())"/>
</td>

$(this)指input代元素，此输入元素的父级为您提供td，而 td 的父级为您提供tr.

function deleteRow(val) {
    $(val).remove();

}

如果您的 deleteThis 函数是在外部 .js 文件中定义的，请在此处检查。

由于您想将 tr 元素传递给函数，因此我提出了此解决方案。不过，$(this).parent().parent()长得挺难看的。我建议使用 Ricardo Lohmann 的解决方案。

于 2012-08-08T22:27:53.570 回答