清除父字段集中的文本框
Clear text boxes in parent fieldset
我使用这个"花式滑块"插件,它的工作原理基本上是设置多个字段集并排。由于每个字段集都是同一个类的成员,所以我试图找到为每个表单添加清除按钮的最简单方法,并使用jQuery单独清除特定表单中的输入字段。
我已经尝试使用.parent()
, .parents()
和.closest()
来隔离用户正在处理的字段集,但没有运气。虽然我可以清除我正在处理的表单,但我最终清除了应用程序中每个字段集中的表单。我们经常使用jQuery,所以我对此相对较新。什么好主意吗?
$('#clearButton').click(function() {
$(this).closest('fieldset').find('input:text').val('');
$('#Pensgc').attr('readonly', false);
});
样本剃刀<fieldset class="step">
<legend>Display Exceptions</legend>
<center>
<table id="ExceptionEditing">
<thead>
<tr>
<th>Exception Name</th>
<th>Starting Letter</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
@for (int i = 0; i < Model.ExceptionList.Count(); i++)
{
<tr id="@Model.ExceptionList[i].Id">
<td>
@Html.TextBoxFor(anything => Model.ExceptionList[i].ExceptionName, new {style = "width:300px;", @readonly = "readonly", maxlength=255 })
</td>
<td style="padding-left:30px;" class="EditStartingLetter">
@Html.TextBoxFor(anything => Model.ExceptionList[i].StartingLetter, new {style = "width:10px;", @readonly = "readonly", maxlength=1 })
</td>
<td style="padding-left:10px;">
<a href="#" class="editException">Edit</a>
</td>
<td style="padding-left:10px;">
<a href="#" class="deleteException">Delete</a>
</td>
</tr>
}
</tbody>
</table>
</center>
</fieldset>
<fieldset class="step">
<center>
<legend>Create Exception</legend>
<table>
<tr>
<td>
<div class="editor-label">
@Html.LabelFor(model => model.createExceptionName)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.createExceptionName, new { @class="AlphaNumOnly", maxlength=255 })
</div>
</td>
<td>
<div class="editor-label">
@Html.LabelFor(model => model.createExceptionLetter)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.createExceptionLetter, new { @class="AlphaNumOnly", maxlength=1 })
</div>
</td>
</tr>
</table>
<button type="submit" class="submitButton">Submit</button>
<button type="submit" class="clearButton">Clear</button>
</center>
</fieldset>
编辑
这是一个工作小提琴:http://jsfiddle.net/rZa2j/
阅读文档后,我在他们的JavaScript中发现了以下行:
current = $this.parent().index() + 1;
,其中$this指向所单击的内容。这意味着:如果打开第二个选项卡,current将为1.
var fieldsetCount = $('#formElem').children().length;
这就是他们获取幻灯片数量的方式。通过将所有内容放在一起,您可以使用以下代码获得当前字段集:
var currentFieldsetIndex = $(".selected").index();
var $currentFieldset = $("#formElem").children().eq(currentFieldsetIndex);
然后你可以用
扩展你的函数$currentFieldset.find("input:text").val("");
刚刚意识到我将type
属性设置为reset
。以前从未使用过这个,但是删除它解决了问题。
<button class="clearButton">Clear</button>
相关文章:
- 如何使用jquery在填充自动完成的值后使文本框只读
- 使用Clipboard.js复制span文本
- 在自动重影文本区域中打字时,会将焦点集中在元素的顶部
- 如何将焦点集中在除某些条件外的单个文本框上
- 如何集中输入,并取消选择其中的文本
- 仅对路径/形状进行动画处理,在 raphael.js 集中没有文本
- 在控制台中显示数据集中的文本
- 不集中时在文本框中反复写单词,集中时停止
- JavaScript焦点()函数没有't将文本区域集中在页面加载上
- 当用户在提交前将注意力集中在文本框上时进行Javascript验证
- BB10-能够在文本框中集中注意力,但不能打字
- 如何在不输入关键字的情况下将文本框集中在按键上
- 如何使文本和宽度100%的分辨率和输入集中
- 清除父字段集中的文本框
- 注意如何在文本末尾集中注意力
- 无法填充框架集中的文本框?我怎么能那样做
- 使用jquery将焦点集中在文本框上
- 是否可以将纯文本存储在flotjquery数据集中
- 使用javascript点击按钮后,文本区域不集中
- 将文本区域集中在ng-click上