Блог

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

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

#php #javascript #html-select

#php #javascript #html-выберите

Вопрос:

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

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

Например, когда я выбрал месяц март, дней будет 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>
 amp;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>
 amp;nbsp;
 <span style="display: table-cell; ">
  <select id="days" onload="loadDays();">

  </select>
 </span>
</span>

Ответ №1:

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

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

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

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

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

Ответ №2:

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

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

<script type="text/javascript" >

 function loadDays() {
 ...
 }

 loadDays();
</script>

Ответ №3:

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

 <body onload="loadDays();">