我有一个模态窗口，其中包含一个表单组，用于为活动概述创建新活动。但是如果用户在我的模态窗口中按“关闭”而不是“添加活动”，则活动将消失。这很棒。但是我想重置我得到的字段，这样他们就不会坐在用户最后使用的字段上。
我发现您可以使用以下内容来实现此目的：
function OnCreateNewActivityBtnClick() {
$('#new-activity-modal').find('form-group').each(function(){
$(this).find('input-group').reset();
});
}
但这没有任何作用。我正在使用bootstrap，HTML看起来像这样：
<div id="new-activity-modal" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1>Add New Activity</h1>
</div>
<div class="modal-body">
<div class="tab-navigation">
<ul class="nav nav-tabs nav-justified" role="tablist">
<li role="presentation" class="active">
<a href="#new-activity-modal-activity-abstract-tab" aria-controls="new-activity-modal-activity-abstract-tab"
role="tab" data-toggle="tab">Activity Abstract</a>
</li>
<li role="presentation">
<a href="#new-activity-modal-activity-description-tab" aria-controls="new-activity-modal-activity-description-tab"
role="tab" data-toggle="tab">Activity Description</a>
</li>
<li role="presentation">
<a href="#help-tab" aria-controls="help-tab"
role="tab" data-toggle="tab">Finalize</a>
</li>
</ul>
</div>
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="new-activity-modal-activity-abstract-tab">
<div class="row" style="padding-top: 10px;">
<div class="col-lg-12">
<div class="form-group">
<div class="input-group" style="padding-bottom: 10px;">
<span id="add-addon-styling" class="input-group-addon">Status</span>
<!-- TODO: Make this automatically rather than hardcode -->
<select class="form-control" id="new-activity-modal-status-dropdown">
<option value="NA">N/A</option>
<option value="ON_TRACK">On Track</option>
<option value="DONE">Done</option>
<option value="ISSUE">Issue</option>
<option value="BEHIND">Behind</option>
<option value="ABANDONED">Abandoned</option>
</select>
<span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The Status of the Activity. Usually On Track but otherwise set to N/A if unsure.">
<b>?</b>
</span>
</div>
<div class="input-group" style="padding-bottom: 10px;">
<span id="add-addon-styling" class="input-group-addon">Activity Name</span>
<input type="text" class="form-control" id="new-activity-modal-name-field"
aria-describedby="new-activity-modal-name-field" required>
<span class="input-group-addon" data-toggle="tooltip" data-placement="top"
title="The Name of the Activity. This name appears in the Activity Overview.">
<b>?</b>
</span>
</div>
<div class="input-group" style="padding-bottom: 10px;">
<span id="add-addon-styling" class="input-group-addon">Responsible</span>
<input type="text" class="form-control" id="new-activity-modal-name-field"
aria-describedby="new-activity-modal-responsible-field">
<span class="input-group-addon" data-toggle="tooltip" data-placement="top"
title="The responsible person for this activity. This it the go-to person for questions, progress and reports.">
<b>?</b>
</span>
</div>
<div class="input-group">
<span id="add-addon-styling" class="input-group-addon">Department</span>
<select class="form-control" id="new-activity-modal-department-dropdown">
<option value="culture">Culture</option>
<option value="commercial">Commercial</option>
<option value="economy">Economy</option>
<option value="technical-department">Technical Department</option>
<option value="it">IT</option>
<option value="flight-department">Flight Department</option>
<option value="legal">Legal</option>
<option value="ground-operation">Ground Operation</option>
<option value="bdo">BDO</option>
<option value="administration">Administration</option>
<option value="training">Training</option>
<option value="passenger-service">Passenger Service</option>
<option value="cabin">Cabin</option>
</select>
<span class="input-group-addon" data-toggle="tooltip" data-placement="top"
title="The department this activity belongs to.">
<b>?</b>
</span>
</div>
</div>
<div class="input-group date" id="new-activity-modal-datetimepicker-start" style="padding-bottom: 10px;">
<span id="add-addon-styling" class="input-group-addon">Start Time</span>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
<span class="input-group-addon" data-toggle="tooltip" data-placement="top"
title="The start of the activity. Usually today's date.">
<b>?</b>
</span>
</div>
<div class="input-group date" id="new-activity-modal-datetimepicker-end">
<span id="add-addon-styling" class="input-group-addon">End Time</span>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
<span class="input-group-addon" data-toggle="tooltip" data-placement="top"
title="The estimated end of the activity.">
<b>?</b>
</span>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade in active" id="new-activity-modal-activity-description-tab">
<div class="row">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success btn-bg" data-dismiss="modal" onclick="OnModalCreateNewActivityBtnClick()">Add Activity</button>
<button type="button" class="btn btn-danger btn-bg" data-dismiss="modal" onclick="OnCloseNewActivityBtnClick()">Close</button>
</div>
</div>
</div>
</div>
</div>
答案 0 :(得分：2)
function OnCreateNewActivityBtnClick() {
$('#new-activity-modal').find('.form-group').each(function(){
$(this).find('.input-group').reset();
});
}
您需要使用.将类用作选择器。
答案 1 :(得分：0)
试试这个
function OnCreateNewActivityBtnClick() {
$('#new-activity-modal').find('form-group').each(function(){
obj = $(this).find('.input-group');
obj.val(obj.data('defaultValue'));
});
}