如何清除崩溃时的某些表单字段

时间:2017-07-20 23:48:35

标签: javascript twitter-bootstrap

我有一个包含可选字段的折叠井的表单。我试图找出如何清除那些可选字段,如果他们选择切换井关闭或点击取消按钮,也可以关闭井。

    <form id="meeting">
      <div class="form-group">
        <label class="white" for="">Set Meeting Date &amp; Time</label>
        <input class="form-control" type="text" value="07/26/2017 09:05 pm" id="MeetingTime" name="MeetingTime" />
      </div>

      <button class="btn btn-primary" type="button" data-target="#offSiteMeeting" data-toggle="collapse" aria-pressed="false" autocomplete="off" aria-controls="offSiteMeeting">Offsite Meeting</button>


      <div class="collapse" id="offSiteMeeting">
        <div class="well">

            <a class="btn btn-default pull-right" href="" data-    toggle="collapse" data-target="#offSiteMeeting" aria-controls="offSiteMeeting">Cancel Offsite</a>

             <div class="form-group">
              <label class="" for="">Meeting Type</label>
              <select id="meetingType" name="meetingType" class="form-control">
                <option value="1">Meeting Type 1 </option>
                <option value="2">Meeting Type 2 </option>
                <option value="3">Meeting Type 3 </option>
              </select>
            </div><!-- close form-group -->


            <div class="form-group">
              <label class="" for="">Location Name</label>
              <input class="form-control" type="text" value="" id="name" name="name" placeholder="ex. Jones Family Home" />
            </div>

            <div class="form-group">
              <label class="" for="">Address</label>
              <input class="form-control" type="text" value="" id="address" name="address" placeholder="1234 Some Street City, State Zip"/>
            </div>

        </div><!-- close well -->
      </div><!-- close collapse -->

      <div class="form-group">
        <button type="submit" class="btn btn-default">Submit</button>
      </div>          
    </form>

所以我要清除的输入(在表格id =“会议”中)是

id = meetingType,id = name,id = address

当id =“offSiteMeeting”的井被折叠时

以下是折叠井的两个按钮

    <button class="btn btn-primary" type="button" data-target="#offSiteMeeting" data-toggle="collapse" aria-pressed="false" autocomplete="off" aria-controls="offSiteMeeting">Offsite Meeting</button>

     <a class="btn btn-default pull-right" href="" data-toggle="collapse"    data-target="#offSiteMeeting" aria-controls="offSiteMeeting">Cancel Offsite</a>

1 个答案:

答案 0 :(得分:0)

将此参数添加到按钮

onclick="function () { document.getElementById('meetingType').value = ''; document.getElementById('name').value = ''; document.getElementById('address').value = '';}"

或者如果你进入jquery

onclick="function () { $('#meetingType').val(''); $('#name').val(''); $('#address').val(''); }"