Datepicker перемешан - PullRequest
Новая
       6

Datepicker перемешан

0 голосов
/ 25 февраля 2012

В этот раз я вытаскиваю свои волосы.

Я пытаюсь реализовать очень простое средство выбора даты jQuery. Я использую код прямо из примера онлайн.

Я наконец-то начал с пустой страницы без CSS (кроме темы пользовательского интерфейса jquery в Redmond). Когда я просматриваю страницу, под моим текстовым полем появляется синяя полоса:

http://gameguidesonline.com/brian/1.png

... Наведение мыши на эту полосу вызывает ошибку JavaScript.

Если я нажму на поле с датой, я получу эту беспорядочную версию средства выбора даты:

http://gameguidesonline.com/brian/2.png

HTML: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
        <link type="text/css" href="/JavaScript/redmond/jquery-ui-1.8.16.custom.css" rel="stylesheet" />    
        <script src="/JavaScript/jquery.min.js" type="text/javascript"></script>
        <script src="/JavaScript/jquery-ui.min.js" type="text/javascript"></script>
        <script src="bench.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
            <div class="demo">
                <p>Date: <input id="datepicker" type="text" /></p>
            </div>

    </form>
</body>
</html>

bench.js: 

$(function () {
    $("#datepicker").datepicker();
});

Версия

jQuery v1.7.1 (также пробовал 1.7) JQuery UI 1.8.16 IE 9, Firefox (последняя версия)

Я даже попробовал сценарий, который нашел, который ждет, пока онклик не свяжет календарь. Это избавляет от синей полосы, но все равно показывает мне беспорядочный календарь.

1 Ответ

2 голосов
/ 25 февраля 2012

Можете ли вы попробовать следующий код напрямую.Разница в том, что я использовал Google CDN пути к JavaScript.Это работает отлично.Я использовал версии, которые вы упомянули. 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
<!--        <link type="text/css" href="/JavaScript/redmond/jquery-ui-1.8.16.custom.css" rel="stylesheet" />    
-->         <link href="http://code.jquery.com/ui/1.8.16/themes/redmond/jquery-ui.css" rel="stylesheet">
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
  <script type="text/javascript" src="http://code.jquery.com/ui/1.8.16/jquery-ui.min.js"></script>

</head>
<body>
    <form id="form1" runat="server">
            <div class="demo">
                <p>Date: <input id="datepicker" type="text" /></p>
            </div>

    </form>
    <script src="bench.js" type="text/javascript"></script>
</body>
</html>
...