jQuery UI datepicker hace que la pantalla se desplace a la parte superior después de seleccionar una fecha

Question

Tengo un par de citadores jQuery dentro de un cuadro de diálogo jQuery. Cada vez que los usuarios seleccionan una fecha del selector de fecha, la pantalla se desplaza a la parte superior. Esto solo ocurre en IE8, no en Firefox 3.6 o Chrome 5. Como la mayoría de los usuarios usarán IE, esto será muy molesto. ¿Alguien puede darme una pista de por qué está sucediendo esto?

Aquí hay un fragmento del HTML para el diálogo:

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

fragmento de código JavaScript para inicializar el cuadro de diálogo y 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' }); 
}; 

EDITAR

estoy usando jQuery 1.4 .2 y UI 1.8.2

Answer 1

Lo he vuelto a examinar. El error ha sido reported with a workaround.

estoy usando una versión miniaturizada de jQuery UI por lo que el código es el siguiente:

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

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

Answer 2

Tenía este problema exacto, pero el problema real resultó ser identificadores duplicados en la página. Una vez que eliminé la identificación duplicada, el problema desapareció por completo.

Answer 3

se debe redefinir el "$" marcador de posición "jQuery" si el texto contiene "#"

Answer 4

que no estaba permitido tocar las bibliotecas JS, añadí esta línea bajo onSelect manejador.

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

por lo que mi código parecía

  $('#txtDate').datepicker({ 
        // other properties 
        onSelect: function (selectedDate) { 
         $('#ui-datepicker-div table td a').attr('href', 'javascript:;'); 
         // other code 
        } 
       });