页面加载后执行jquery脚本

时间:2015-11-10 10:09:34

标签: javascript php jquery html

我在页面加载后尝试执行以下脚本。

首先我加入了jquery。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

然后我写了我的剧本:

<script>
    function scale()
    {
        $hc = document.getElementById("hc").innerHTML;
        $he = document.getElementById("he").innerHTML;
        $we = document.getElementById("we").innerHTML;

        jQuery('#mydiv_cam')    .css('height', '8000px');

        jQuery('#camera')       .css('height', $hc+"px");
        jQuery('#viewport')     .css('height', $he+"px");
        jQuery('#viewport')     .css('width', $we+"px");
    }
</script>

这是我的身体标签

<body onload="scale();">

在我体内加载变量:

<p hidden="true" id="hc"> <?php echo $höhe_camera ?> </p>
<p hidden="true" id="he"> <?php echo $heightexplode[1] ?> </p>
<p hidden="true" id="we"> <?php echo $widthexplode[1] ?> </p>

但没有任何反应。

2 个答案:

答案 0 :(得分:0)

如果你想在文件加载上执行你的功能,那就这样做:

$(document).ready(function(){

    $hc = document.getElementById("hc").innerHTML;
    $he = document.getElementById("he").innerHTML;
    $we = document.getElementById("we").innerHTML;

    jQuery('#mydiv_cam')    .css('height', '8000px');

    jQuery('#camera')       .css('height', $hc+"px");
    jQuery('#viewport')     .css('height', $he+"px");
    jQuery('#viewport')     .css('width', $we+"px");
   //put everything else inside here
});

这会将此功能设置为文档的就绪功能,以便在文档完全加载后立即执行。您还可以删除body标签上的属性。此外,您可能想要修复您的jQuery导入:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

答案 1 :(得分:0)

只需删除php标记之前和之后的空格即可。写下来如下:

<p hidden="true" id="hc"><?php echo $höhe_camera ?></p>
<p hidden="true" id="he"><?php echo $heightexplode[1] ?></p>
<p hidden="true" id="we"><?php echo $widthexplode[1] ?></p>

这会奏效。当你在jquery中使用p标签的innerhtml时,它也接受空格,并且在你用px连接它之后,它将被视为1 px是无法工作的样式表。 试试吧。