我知道这个问题已被问过多次,但我无法让它工作,我有一个循环遍历集合的表,每行都有一个复选框,我想删除描述的文本复选框被选中?????。感谢您的帮助!!
表格
<table class="table table-striped">
<tr><th>Task Description</th><th>Completed</th>
@if (Model.ListOfTasks.Count() == 0)
{
<tr><td colspan="3" class="text-center">No Tasks</td></tr>
}
else
{
foreach (var task in Model.ListOfTasks)
{
<tr>
@Html.HiddenFor(x => x.TaskID)
<td><span>@task.Description</span></td>
<td>
@using (Html.BeginForm("Complete", "Task", new { id = task.TaskID }))
{
<input type="checkbox" id="checkbox" />
}
</td>
<td>
@using (Html.BeginForm("Delete", "Task", new { id = task.TaskID }))
{
<button class="btn btn-danger btn-xs" type="submit">Remove</button>
}
</td>
</tr>
}
}
</table>
<a href="#" onclick="ShowTaskPopup()" class="btn btn-primary">Add</a>
<div class="modal fade" id="popupTaskForm" style="display: none;">
<div class="modal-header">Add New Task</div>
<div class="modal-body">
@Html.ValidationSummary(false)
@using (Html.BeginForm("Create", "Task", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<form class="well">
<fieldset>
<table class="table-condensed">
<tr class="strikeout">
<td><label>Task Name</label></td>
<td>@Html.TextBoxFor(x => x.TaskName, new { @class = "form-control" })</td>
<td><label>Description</label></td>
<td>@Html.TextBoxFor(x => x.Description, new { @class = "form-control" })</td>
</tr>
</table>
<button type="submit" class="btn btn-primary">Submit</button>
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
</fieldset>
</form>
}
</div>
</div>
查询
$('#checkbox').change(function () {
if (this.checked) {
$(this).parent().parent().css("text-decoration","line-through");
} else {
$(this).parent().parent().css("text-decoration", "none");
}
});
最佳答案
Razor 将添加 <form>
复选框周围的标签,因此您将 css 应用于 <td>
包含复选框,而不是您可能认为的父行 parent().parent();
尝试使用最近的选择器遍历dom树并找到父行:
$(this).closest("tr").css("text-decoration","line-through");
关于jquery - 复选框选择上的文本删除线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45345288/