从PHP调用JS功能不起作用

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 
}); 

当您从PHP输出JS函数时，应该使more_info执行。还有一点很好，因为你没有准备好执行这个函数，所以你需要确保html可以被JS修改。将所有JS放在结束标记之前通常是最佳做法。这将确保您的html加载尽可能快，并且您的JS将始终可以访问您尝试编辑的HTML。随着JS头标记，你需要确保你的JS是在正确的时间使用被称为：

$(function() { 
}); 

OR

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

OR

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

所有这些方法在页面初始化的不同时间执行。在头部标记中使用JS，您的浏览器将需要将所有JS下载到客户端，然后才能开始呈现HTML，这也将增加到访问网站和实际查看网站之间的时间。