0

2つのdatePickersjqueryUIを配置しようとしています。エラー：ページをロードすると、datePickersが表示されません。ただし、フォームを投稿すると表示されます。

これが私のコードです：

<?php
//...
if ($_POST){
    $dateFrom=getInput('dateFrom').' 00:00:00';
    $dateTo=getInput('dateTo').' 23:59:59';
    $defDate=explode('-',getInput('dateFrom'));
    $defDate=$defDate[1].'/'.$defDate[2].'/'.$defDate[0];
    $employeeID=getInput('employeeID');
}else{
    $dateFrom=date('Y-m-d',strtotime('-1 day'));
    $dateTo=date('Y-m-d').' 23:59:59';
    $defDate=date('m/d/Y',strtotime('-1 day'));
    $employeeID=0;
}

//================================== calendar widget ==================================
echo '<script type="text/javascript">$(function() {';
echo '  $( "#datepicker1" ).datepicker( "option", "dateFormat", "yy-mm-dd" );
        $( "#datepicker1" ).datepicker({
                showWeek: true,
                firstDay: 0,
                changeMonth: true,
                defaultDate: "'.$defDate.'",
                changeYear: true,';
echo "  altField: '#datepickera',altFormat: 'yy-mm-dd'});";
echo '  $( "#datepicker2" ).datepicker( "option", "dateFormat", "yy-mm-dd" );
        $( "#datepicker2" ).datepicker({
                showWeek: true,
                firstDay: 0,
                changeMonth: true,
                changeYear: true,';
echo "  altField: '#datepickerb',altFormat: 'yy-mm-dd'});";
echo '});';
echo '</script>';

echo '<form action="" method="post">';
echo '<table>';
echo '<tr><td width="250">From Date<input type="text" id="datepickera" name="dateFrom" value="" /><br /><div id="datepicker1"></div></td>';
echo '<td width="250">To Date<input type="text" id="datepickerb" name="dateTo" value="" /><br /><div id="datepicker2"></div></td>';
echo '<td>'. __('Choose Employee','j-v3').':<br /><select name="employeeID" /><option value="0">--- All Employees ---</option>';
echo '</select> <input type="submit" value="Get Data" /></td>';
echo '</tr>';
echo '</table>';
echo '</form>';
//...
?>

jquery1.6.2とjquery-ui1.8.15を使用しています

助けてください。常にdatePickersを表示するにはどうすればよいですか？

4

1 に答える 1

0

見つけた。

スクリプトをこれに変更しても機能しません。

echo '<script type="text/javascript">$(document).ready(function() {';

しかし、このコードを使用すると、機能します

echo '<script type="text/javascript">window.onload = function() {';

グーグルで検索した後のそれらの違いは、最初のものはDOMの準備ができた後に実行されるということです、ドキュメントは本当に準備ができている必要はありません。2つ目は、ドキュメントのすべての部分の準備ができた後に実行されるため、時間がかかります。

私の場合、2番目のアプローチのみが機能しており、速度は遅くなりますが、機能します。

于 2013-02-27T03:58:06.603 に答える