2012-04-30 4 views
2

У меня нет выбора даты на моей веб-странице, но в скрипке он идет, что мне не хватает?сборщик дат в javascript

http://jsfiddle.net/cBwEK/

Он приходит штраф в скрипку, но я не подвожу ничего в моей веб-странице. Я написал ниже сценариев

Исходный код целом здесь: http://www.monkeyphysics.com/mootools/script/2/datepicker

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>JSP Page</title>  
    <script type="text/javascript" src="datepicker.js"></script>  
    <script type="text/javascript" src="mootools-yui-compressed.js"></script> 
    <script type="text/css" src="datepicker.css"></script>   
    <script type="text/javascript">   
      new DatePicker('.picker', { 
    pickerClass: 'datepicker ', 
    allowEmpty: true 
    });   
    </script>   
</head> 
    <body> 
    <label>Datepicker starting at and allowing no value:</label> 
    <input name='date_allow_empty' type='text' value='' class='date picker' /> 
    </body> 
</html> 
+0

Попробуйте загрузить mootools ** перед ** сценарием datepicker. – Joseph

ответ

4

Вам необходимо запустить код JavaScript после существуют соответствующие элементы в DOM. Просто переместите скрипт в конец страницы. Кроме того, если сценарий выбора даты зависит от MooTools, вам нужно поставить datepicker include после MooTools. Например:

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>JSP Page</title>  
    <!-- FIRST CHANGE HERE, swapping the order of the script elements --> 
    <script type="text/javascript" src="mootools-yui-compressed.js"></script> 
    <script type="text/javascript" src="datepicker.js"></script>  
    <link type="text/css" rel="stylesheet" href="datepicker.css"> 
</head> 
    <body> 
    <label>Datepicker starting at and allowing no value:</label> 
    <input name='date_allow_empty' type='text' value='' class='date picker' /> 
    <!-- SECOND CHANGE HERE, moving your script to *after* the elements it operates on --> 
    <script type="text/javascript">   
      new DatePicker('.picker', { 
    pickerClass: 'datepicker ', 
    allowEmpty: true 
    });   
    </script>   
    </body> 
</html> 

Live copy Факс: source

Там я только переехал свой сценарий, но вы можете переместить все скрипты вниз там as the YUI people suggest.

Причина, по которой она работает в jsFiddle, заключается в том, что у вас есть скрипка, чтобы загрузить код JavaScript из события onload, что происходит очень поздно в этом процессе; к тому времени элементы DOM.

+0

спасибо T.J за ваш ответ, но я до сих пор не получаю выбора даты, я добавил ваш код, но с той же проблемой, мне нужно переместить все сценарии в конец секции тела, кроме скрипта motools? – saroj

+0

Я изменил последний скрипт css для ссылки href ... и он сработал :) – saroj

+1

@saroj: Да, я просто заметил, что, когда вы делаете живой пример (который я теперь добавил к ответу). Рад, что помогло. –

2

Попробуйте загрузить инициализацию DatePicker после загрузки страницы.

A good programmer always use View Source 

Если бы вы видели скрипку вы бы увидели:

<script type='text/javascript'> 
    window.addEvent('load', function() { 
     new DatePicker('.picker', { 
      pickerClass: 'datepicker ', 
      allowEmpty: true 
     }); 
    }); 
</script> 

Это потому, что HTML-элементы не загружены и сценарии их не видят.

Смежные вопросы