如何在外部Javascript中使用PHP变量

时间:2014-01-20 00:00:10

标签: javascript php jquery html arrays

我正在尝试在我的外部javaScript中使用PHP创建的数组。我有PHP代码,根据通过url给出的用户ID将目录中的图像放入数组中,我希望能够在javaScript中使用这个数组,这样我就可以创建照片幻灯片,并根据用户ID更改图像。我认为这是可以实现的,因为我在网上进行了研究,但不知怎的,它对我来说不起作用。我不确定我做错了什么。

在我的html的头部,我将此代码添加到我的外部javaScript中并在Javascript中声明变量/数组。不确定它是否正确,我从其中一个解决方案中得到了它:

<script src="js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">var userphoto = "<?= $galleryarray ?>";</script>
    <script type="text/javascript">var userid = "<?= $user_id ?>";</script>
    <script src="javascript.js"></script>

这是我基本HTML中的PHP代码:

  

这是我的外部JavaScript代码:

$(document).ready(function(){

var photodisplay = 
[
$("#photo1"),
$("#photo2"),
$("#photo3"),
$("#photo4"),
$("#photo5"),
];

var userid = "<?php echo json_encode($user_id); ?>";  // getting php variable 
var userphoto = "<?php echo json_encode(galleryarray); ?>";


// List of images for user one
/*var userphoto = new Array();
userphoto[0] = "Photos/1/1.jpg";
    userphoto[1] = "Photos/1/2.jpg";
        userphoto[2] = "Photos/1/1.jpg";
            userphoto[3] = "Photos/1/1.jpg";
                userphoto[4] = "Photos/1/1.jpg";*/

//preloading photos
function preloadingPhotos() {
for (var x=0; x<5; x++)
{
    photodisplay[x].attr("src", "Photos/" + userid + "/" + userphoto[x]);
    photodisplay[x].hide();
    console.log("preloaded photos");

}
displayPhoto();
}

function displayPhoto(){

    photodisplay[0].fadeIn(3000);
    photodisplay[0].delay(3000).fadeOut(3000, function() { //first callback func
    photodisplay[1].fadeIn(3000);
    photodisplay[1].delay(3000).fadeOut(3000, function() { //second callback func
    photodisplay[2].fadeIn(3000);
    photodisplay[2].delay(3000).fadeOut(3000, function() { //third callback func
    photodisplay[3].fadeIn(3000);
    photodisplay[3].delay(3000).fadeOut(3000, function() { // fourth callback func
    photodisplay[4].fadeIn(3000);
    photodisplay[4].delay(3000).fadeOut(3000, function() {
    setTimeout(displayPhoto(), 3000);
    });
    }); 
    });
    }); 
    });

}// end of function displayPhoto


window.onload = preloadingPhotos;
}); //end ready

PHP:

3 个答案:

答案 0 :(得分:0)

让你的PHP定义<script>标签内的变量,如...

<script>
    var userid = "<?php echo json_encode($user_id); ?>";
    var userphoto = "<?php echo json_encode(galleryarray); ?>";
</script>

您的以下外部JavaScript文件将能够使用userid和userphoto变量,即使它们未直接在外部文件中定义

答案 1 :(得分:0)

在下面的代码中userphoto&amp; userid现在是javascript变量。

<script src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">var userphoto = "<?= $galleryarray ?>";</script>
<script type="text/javascript">var userid = "<?= $user_id ?>";</script>
<script src="javascript.js"></script>

Php代码不会在外部javascript文件中执行。所以当执行下面的行时 userid将是一个字符串,其中包含“&lt;?php echo json_encode($ user_id);?&gt;”作为其值,类似于userphoto。

var userid = "<?php echo json_encode($user_id); ?>";  // getting php variable 
var userphoto = "<?php echo json_encode(galleryarray); ?>";

将基本HTML修改为

<script src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">var userphoto = <?php echo json_encode(galleryarray); ?>;     </script>
<script type="text/javascript">var userid = <?php echo json_encode($user_id); ?>;</script>
<script src="javascript.js"></script>

并且您可以在外部javascript文件中使用这些变量,前提是在分配这些变量后加载它们。所以你不需要再次在外部javascript中分配这些变量。

答案 2 :(得分:0)

只需将名为 javascript.js 的文件重命名为 javascript.php ,然后将脚本标记更改为<script src="javascript.php"></script>

更新

您也可以使用.htaccess将 javascript.js 保存在脚本代码中,方法是在.htaccess文件中执行以下操作:

RewriteRule ^javascript\.js$ javascript.php 
  

有关在这种情况下使用.htaccess的更多详情,请查看   以下问题的答案:

     

Parsing PNG as PHP via htaccess works only on local server but not on webserver