javascript - .show() 在 'display :block' 之后不起作用

Question

附件是我的 javascript 和 html。 在 Debug模式下，我可以确认“display: none”更改为“display :block” 但我没有看到 popupEventForm 表单打开。 有什么想法吗？ 谢谢，彼得

function ShowEventPopup(date) {
  debugger;
  ClearPopupFormValues();
  $('#popupEventForm').show();
  $('#eventTitle').focus();
}

<div class="container">
  <div id='calendar' style="width:65%"></div>
</div>


<div id="popupEventForm" class="modal hide" style="display: none;">
  <div class="modal-header">
    <h3>Add new event</h3>
  </div>
  <div class="modal-body">
    <form id="EventForm" class="well">
      <input type="hidden" id="eventID">
      <label>Event title</label>
      
      <input type="text" id="eventTitle" placeholder="Title here"><br />
      <label>Scheduled date</label>
      
      <input type="text" id="eventDate"><br />
      <label>Scheduled time</label>
      
      <input type="text" id="eventTime"><br />
      <label>Appointment length (minutes)</label>
      
      <input type="text" id="eventDuration" placeholder="15"><br />
    </form>
  </div>
  <div class="modal-footer">
    <button type="button" id="btnPopupCancel" data-dismiss="modal" class="btn">Cancel</button>
    <button type="button" id="btnPopupSave" data-dismiss="modal" class="btn btn-primary">Save event</button>
  </div>
</div>

Answer 1

您还包含了引导隐藏类..

<div id="popupEventForm" class="modal hide" style="display: none;">

将你的js更改为:

function ShowEventPopup(date) {
        debugger;
        ClearPopupFormValues();
        $('#popupEventForm').show().removeClass('hide');
        $('#eventTitle').focus();
    }