2010-08-10 2 views
7

У меня есть пара jQuery datepickers внутри диалогового окна jQuery. Всякий раз, когда пользователи выбирают дату из datepicker, экран прокручивается вверх. Это происходит только в IE8, а не в Firefox 3.6 или Chrome 5. Так как большинство пользователей будет пользовательским IE, это будет очень раздражать. Может ли кто-нибудь дать мне понять, почему это происходит?jQuery UI datepicker заставляет экран прокручиваться вверх, после выбора даты

Вот отрывок из HTML для диалога:

<div id="AppointmentDialog" style="display: none; font-size: 12px;"> 
    <table> 
     <tr class="lesson notAvailable allDay"> 
      <td> 
       Start 
      </td> 
      <td> 
       <input id="txtStartDate" type="text" readonly="readonly" style="width: 90px" class="lesson notAvailable allDay" /> 
       <input id="txtStartTime" type="text" style="width: 50px" class="lesson notAvailable" /> 
       <input id="hidStartTime" type="hidden" value="" /> 
      </td> 
     </tr> 
     <tr class="notAvailable allDay"> 
      <td> 
       End 
      </td> 
      <td> 
       <input id="txtEndDate" type="text" readonly="readonly" style="width: 90px" class="notAvailable allDay" /> 
       <input id="txtEndTime" type="text" style="width: 50px" class="notAvailable" /> 
       <input id="hidEndTime" type="hidden" value="" /> 
      </td> 
     </tr> 
    </table> 
</div> 

Отрывок из Javascript инициализируются диалога и datepickers:

$(document).ready(function() { 
    initDialogs(); 
}); 

function initDialogs() { 
    // Configure the New Appointment dialog 
    $("#AppointmentDialog").dialog({ 
     autoOpen: false, 
     resizable: false, 
     width: 320, 
     modal: true, 
     title: 'Appointment', 
     buttons: { 
      "Close": function() { $(this).dialog("close"); }, 
      "Save": function() { 
       // Function call 
      } 
     } 
    }); 

    $.mask.definitions['h'] = '[012]'; 
    $.mask.definitions['m'] = '[]'; 
    $("#txtStartTime").mask("h9:m9"); 
    $("#txtEndTime").mask("h9:m9"); 

    // Init date pickers 
    $("#txtStartDate").datepicker({ dateFormat: 'dd-mm-yy' }); 
    $("#txtEndDate").datepicker({ dateFormat: 'dd-mm-yy' }); 
}; 

EDIT

Я использую JQuery 1.4 .2 и UI 1.8.2

ответ

6

Я просмотрел его снова. Ошибка была reported with a workaround.

Я использую Минимизированный версию JQuery UI, так что код выглядит следующим образом:

(B?" ui-priority-secondary":"")+'" href="#">'+q.getDate()+"</a>")+"</td>" 

(B?" ui-priority-secondary":"")+'" href="javascript:;">'+q.getDate()+"</a>")+"</td>" 
+0

Спасибо за это! Ты просто спас мне целый ад! –

3

У меня была эта точная проблема, но реальная проблема оказалась дублирующие иды на этой странице. Как только я удалил дубликат id, проблема полностью исчезла.

0

Вы должны переопределить «$» заполнитель «Jquery», если текст содержит «#»

+0

Добро пожаловать в SO. Это должен быть комментарий, а не ответ. –

0

не разрешили трогать Js библиотеки, я добавил эту линию под onSelect обработчиком.

$('#ui-datepicker-div table td a').attr('href', 'javascript:;'); 

мой код выглядел

  $('#txtDate').datepicker({ 
        // other properties 
        onSelect: function (selectedDate) { 
         $('#ui-datepicker-div table td a').attr('href', 'javascript:;'); 
         // other code 
        } 
       }); 
Смежные вопросы