Javascript删除带有值的循环文本框中的函数
Javascript删除带有值的循环文本框中的函数
提问于 2015-04-19 12:24:41
我是网页开发的新手，我正在尝试使用Javascript向我显示的表单值添加一个添加/编辑/删除功能。嗯，我真的找不到要解释的话，但这正是我想要完成的。
我有一个循环，它列出了数据库中的折扣：
@foreach (var discount in Model.Discounts)
{
<div class="editor-label">
<label for="@discount.Key.DiscountCode">@discount.Key.DiscountName</label>
</div>
<div class="editor-field">
<input class="@discount.Key.DiscountCode" name="@discount.Key.DiscountCode" readonly="true" type="text" />
<a class="remove" data-key="@discount.Key.DiscountCode" href="javascript:void(0);">Remove</a>
<a class="edit" data-key="@discount.Key.DiscountCode" href="javascript:void(0);">Edit</a>
</div> <br />
}
<a class="add-discount" href="javascript:void(0);">Add Discount</a>正如您可以想象的那样，这将循环到这种输出中：
用于删除Label1编辑的Label1文本框
用于删除Label2编辑的Label2文本框
用于删除Label3编辑的Label3文本框
如何使用javascript/jquery使这些命令工作。
请注意，删除/编辑功能仅适用于显示的数据，而不适用于数据库。我的意思是，如果我单击Delete，它将只从显示中删除其相应的标签和文本框，而不是在数据库中删除，而且当单击Edit时，它将只允许Textbox更改其中的数据。
任何帮助都将不胜感激。非常感谢！
我正在使用Visual 2013，并使用ASP.NET MVC4进行开发
后续行动：
我想知道如何自动计算文本框的总价值，并将其显示在一个“总折扣”文本框中。
请注意，当我编辑或删除折扣时，我的列表中的编辑和删除功能应该会影响总数。
我试图搜索解决方案，但我所看到的只有固定的文本框，每个文本框都有类名，与我的文本框不同，每个文本框都有来自数据库的不定数量的文本框。
任何帮助都将不胜感激！
回答 2
Stack Overflow用户
回答已采纳
发布于 2015-04-19 12:36:22
您可以使用以下JQuery函数删除/编辑，还可以在编辑时更改文本，使其更有意义：
$('.edit').on('click', function () {
var parent = $(this).parent();
var input = parent.find('input');
if (input.attr('readonly') === 'readonly') {
$(this).text('Stop Edit');
}
else {
$(this).text('Edit');
}
input.attr('readonly', !input.attr('readonly'));
});
$('.remove').on('click', function () {
var parent = $(this).closest("div");
var uncle = parent.prev();
parent.remove();
uncle.remove();
});小提琴
Stack Overflow用户
发布于 2015-04-19 12:31:16
$(document).ready(function() {
$("a.remove").on("click", function() {
$(this).closest("div").remove();
});
$("a.edit").on("click", function(){
$(this).siblings("input").prop("readonly",false).focus();
});
});您可以尝试使用上面的代码，.remove()将删除元素节点并进行编辑，使readonly属性false成为可编辑的输入元素。
小提琴演示
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29729814
复制相关文章
相似问题
腾讯云开发者
