Question

我有一个包含输入的表格。有默认值的输入，没有默认值的输入。我想在按钮点击时将输入值重置为默认值。我不会做

$('#tableid').find('input[type=text]').val('');

因为我说有输入默认值，我不想弄乱输入的值。

我也试过reset()喜欢

$('#tableid').find('input[type=text]').reset();

但我收到错误reset is not a function

reset内有input table without form的方法。

Answer 1

试试这个：将默认值存储为输入框中的数据，如下所示

<input type="text" data-default="your default value" value="your default value">

并在按钮单击

上运行下面的代码

$('#tableid').find('input[type=text]').each(function(){
      var defaultVal = $(this).data('default');
      $(this).val(defaultVal);
});

示例

$(function(){ $('#resetBtn').click(function(){ $('#tableid').find('input[type=text]').each(function(){ var defaultVal = $(this).data('default'); $(this).val(defaultVal); }); }); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="tableid"> <tr><td><input type="text" data-default="first Default" value="first Default"></td></tr> <tr><td><input type="text" data-default="Second Default" value="second Default"></td></tr> <tr><td><input type="text" data-default="third Default" value="third Default"></td></tr> </table> <input type="button" value=" RESET " id="resetBtn">

Answer 2

使用此方法通过将0传递给.get（）来获取第一个HTML元素：

$('#tableid').find('input[type="text"]').get(0).reset();

或（相同但略短）：

$('#tableid').find('input[type="text"]')[0].reset();

Answer 3

<强> HTML

<table id="test">
    <tr>
        <td><input type="text" data-default="test1" /></td>
        <td><input type="text" data-default="test2" /></td>
        <td><input type="text" data-default="test3" /></td>
    </tr>
</table>
<button id="clickme">Click me</button>

<强>的jQuery

$("#clickme").on("click",function(){
    $('#test').find('input[type=text]').each(function(){
        $(this).val($(this).attr("data-default"));
    });
});

<强> JS Fiddle

重置表格中所有输入的默认值，不包括任何形式

3 个答案: