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。使用head标记中的JS，您需要确保使用以下命令在正确的时间调用JS：

$(function() {
});

OR

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

OR

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

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

从PHP调用JS函数无法正常工作

1 个答案: