Как загрузить html со значениями при загрузке страницы с помощью javascript в PHP?

У меня возникли проблемы с загрузкой HTML <select> со значениями при первой загрузке страницы или при обновлении.

На самом деле я пытаюсь создать date_select с 3 выпадающими меню, которые включают год, месяц и дни, в которых при изменении меню месяца или меню года автоматически будет изменено количество дней.

Например, когда я выбрал месяц Март, дни будут 31 или апрель, дни будут только 30.

Моя проблема в том, когда страница сначала загружается дневное меню - оно пустое. Я попробовал onload на <select>, но это не сработало. Я новичок в программировании, поэтому у меня возникают проблемы даже с такими простыми упражнениями, как это. Пожалуйста, помогите.

date_select.php

<script type="text/javascript" >

 function loadDays() {
  var year = parseInt(document.getElementById('years').value);
  var month = document.getElementById('months').value;
  var months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
  var days = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);

  if ((year % 4) == 0)  days[1] = 29;

  var days_select = document.getElementById('days');
  days_select.options.length = 0;

  for(i in months) {
   if (month == months[i]) {
    for(var j = 1; j <= days[i]; j++ ) days_select.options[days_select.options.length] = new Option(j, j);
    break;
   }
  }
 }

</script>

<span style="display: table; ">
 <span style="display: table-cell; ">
  <select id="years" onchange="loadDays();">
   <?php 
    for($year = 1900; $year <= 2100; $year++ ) {
     if ($year == date('Y')) echo "<option value='$year' selected=''>" . $year . "</option>";
     else echo "<option value='$year'>" . $year . "</option>";
    }
   ?>
  </select>
 </span>
 &nbsp;
 <span style="display: table-cell; ">
  <select id="months" onchange="loadDays();">
   <?php 
    $months = array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" );

    foreach($months as $month){
     if ($month == date('M')) echo "<option value='$month' selected=''> " . $month . "</option>";
     else echo "<option value='$month'> " . $month . "</option>";
    }
   ?>
  </select>
 </span>
 &nbsp;
 <span style="display: table-cell; ">
  <select id="days" onload="loadDays();">

  </select>
 </span>
</span>
Author: tmr08c, 2011-05-04
Source

3 answers

Попробуйте поместить атрибут onload в тег body вместо тега select.

<body onload="loadDays();">
 1
Author: grc, 2011-05-04 08:58:30

Вам следует рассмотреть возможность использования jQuery, мощной и кроссбраузерной библиотеки javascript, которая пытается сделать программирование на javascript более доступным.

Например, он предоставляет функцию, которая ожидает загрузки содержимого DOM перед вставкой в него javascript (и это лучше, чем событие "onload", потому что оно не ожидает загрузки изображений)

В jquery вы (почти) всегда оборачиваете свой javascript в эту функцию

$(document).ready(function(){
         //Here goes your code
});

Если вам нужно javascript, вам действительно следует проверить jQuery или другие фреймворки

 4
Author: Nicola Peluchetti, 2011-05-04 09:44:01

Я думаю, что будет достаточно, если вы просто переместите свой блок javascript ниже этих диапазонов и выделите, а затем вызовете свою функцию сразу после ее объявления.

<span style="display: table; ">
...
</span>

<script type="text/javascript" >

 function loadDays() {
 ...
 }

 loadDays();
</script>
 3
Author: Martin Lazar, 2011-05-04 09:34:34