Question

这个问题与this ..

有关

Html代码：

<ul class="nav nav-tabs">
    <li class="active"><a href="#a" data-toggle="tab">A</a>
    </li>
    <li><a href="#b" data-toggle="tab">B</a>
    </li>
</ul>
<div class="tab-content">
    <div class="tab-pane active" id="a">
        <form id="form1" class="form">
            <fieldset id="abc">
                <input type="text" name="a">
                <input type="text" name="b">
            </fieldset>
            <fieldset id="xyz">
                <input type="text" name="x">
                <input type="text" name="y">
                <input type="text" name="z">
            </fieldset>
        </form>
    </div>
    <div class="tab-pane" id="b"></div>
</div>

Javascript代码：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
               $("#xyz > input").val("");
            });

即使类似按钮按下按钮，这也不起作用..

Demo

真心感谢任何帮助

由于

Answer 1

一旦DOM准备就绪，您需要注册shown.bs.tab事件处理程序：

$(function () {
  $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    $("#xyz > input").val("");
  });      
});

否则on正试图将处理程序绑定到空元素列表。

Demo

Answer 2

这将通过fieldset id属性找到特定字段集中的所有输入，它将遍历div或外部的所有输入字段，并在切换时清除它们。

 $('a[data-toggle="tabs"]').on('shown.bs.tab', function (e) {
        $("#fieldset_ID").find(':input').each(function() {
            $(this).val('');
        });
    });

在bootstrap选项卡上重置表单字段集中的文本字段

2 个答案: