Вызов функции JS из PHP не работает

Question

Используя метод, рекомендованный пользователем в предыдущем вопросе, я использовал только один документ (index.php) для отображения другого содержимого вместо создания одного файла для каждого из них.

Это код:

HTML

<a href="index.php">Home</a> 
<a href="?id_page=1">More info</a> 
<a href="?id_page=2">Contact Us</a> 


<div id="index">...index content...</div> 
<div id="more_info">...more info content...</div> 

JS

$(document).ready(function(){ 
    function more_info(){ 
     $('#index').hide(); 
     $('#more_info').show(); 
    } 
}); 

PHP

<?php 
    if (isset($_GET['id_page'])) { 
     $id = $_GET['id_page']; 
     if ($id == 1) { 
      ?> 
      <script> 
       more_info(); 
      </script> 
      <?php 
     } 
    } 
?> 

Это не работает. Но если я изменю <script> more_info(); </script> для:

<script> 
    $(document).ready(function(){ 
     $('#index').hide(); 
     $('#quienes-somos').show(); 
    }); 
</script> 

Он работает. Почему это?

Answer 1

Похоже, проблема связана с тем, что вы определяете функцию more_info внутри функции. Это выводит его из глобальной области действия, которая не сделает эту функцию доступной в любом месте, кроме внутренней функции вашего документа.

//more_info is now available globally 
function more_info(){ 
    $('#index').hide(); 
    $('#more_info').show(); 
} 

$(document).ready(function(){ 
    //document ready code here 
}); 

Это должно сделать выполнение функции more_info при выводе функции JS из PHP. Также хорошо заметить, что, поскольку вы не выполняете функцию при готовности, вам нужно убедиться, что html доступен для JS, чтобы изменить его. Обычно лучше всего поставить все свои JS непосредственно перед закрывающим тегом. Это обеспечит максимальную загрузку ваших html-файлов, и ваш JS всегда будет иметь доступ к HTML, который вы пытаетесь отредактировать. С JS в голову тега необходимо убедиться, что ваш JS вызывается в нужное время с помощью:

$(function() { 
}); 

ИЛИ

$(document).ready(function() { 
}); 

ИЛИ

$(window).load(function() { 
}); 

Все эти методы выполняются в разное время во время инициализации страницы. С помощью JS в заголовке вашего браузера вам нужно будет загрузить все JS клиенту, прежде чем он сможет начать отображать HTML-код, который также будет добавлять время между посещением сайта и фактическим просмотром сайта.