2010-08-10 29 views
7

Tôi có một vài trình tạo ngày tháng jQuery trong một hộp thoại jQuery. Bất cứ khi nào người dùng chọn một ngày từ datepicker, màn hình sẽ cuộn lên trên cùng. Điều này chỉ xảy ra trong IE8 không phải là Firefox 3.6 hoặc Chrome 5. Vì phần lớn người dùng sẽ sử dụng IE, điều này sẽ rất khó chịu. Bất cứ ai có thể cho tôi một đầu mối là tại sao điều này xảy ra?jQuery UI datepicker khiến màn hình cuộn lên trên cùng sau khi chọn một ngày

Dưới đây là một đoạn mã HTML cho hộp thoại:

<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> 

Snippet của Javascript để khởi thoại và 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

Tôi đang sử dụng jQuery 1.4 .2 và Giao diện Người dùng 1.8.2

Trả lời

6

Tôi đã xem lại nó. Lỗi này là reported with a workaround.

Tôi đang sử dụng một phiên bản rút gọn của jQuery UI để mã trông như thế này:

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

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

Cảm ơn cho điều này! Bạn chỉ cần lưu lại cho tôi toàn bộ địa ngục của rất nhiều thời gian! –

3

Tôi có vấn đề này chính xác, nhưng vấn đề thực sự hóa ra là id trùng lặp trên trang. Khi tôi đã xóa id trùng lặp, sự cố đã biến mất hoàn toàn.

0

Bạn cần phải ghi đè lên "$" giữ chỗ với "jQuery" nếu văn bản có chứa "#"

+0

Chào mừng bạn đến với SO. Đây phải là một bình luận, không trả lời. –

0

tôi không được phép chạm vào các thư viện js, tôi đã thêm dòng này dưới onSelect xử lý.

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

do đó, mã của tôi trông giống như

  $('#txtDate').datepicker({ 
        // other properties 
        onSelect: function (selectedDate) { 
         $('#ui-datepicker-div table td a').attr('href', 'javascript:;'); 
         // other code 
        } 
       }); 
Các vấn đề liên quan