设置重置按钮以清除文本类型的特定单个输入

Question

我有以下内容：

<div id="section1">
 <label> Label 1 </label>
 <br>
 <input type="text" id="input_section1">
 <button type="reset" class="clear"></button>
</div>

这就是html必须保持结构化的方式。我在页面上有其他与上面相同的div（称为＃section2，＃section3等），并且没有任何输入在表单中。

所以我想要的是重置与之关联的特定输入的按钮;在上面的例子中，输入'#input_section1'。

当我点击重置按钮时，它正在清除页面上的每个输入。

Answer 1

一个简单的解决方案：

<input type="button" onClick="document.getElementById('input_secion1').value='';">

这应该是你要求的。

Answer 2

您可以使用.siblings()：

使用以下jquery代码

$(document).on('click','.clear',function(){
    $(this).siblings( "input" ).val('');
});

这将找到当前点击元素的input type sibling并重置它。

请参阅fiddle