在Javascript文件中获取PHP变量

I have a PHP file on my server which is counting the number of files in a directory. I would like to get the number of files ($fileCount) in my Javascript file.

我的服务器上有一个PHP文件,它计算目录中的文件数。我想在我的Javascript文件中获取文件数($ fileCount)。

numberOfImages.php:

<?php
$dir = "/my/directory/";
$fi = new FilesystemIterator($dir, FilesystemIterator::SKIP_DOTS);
$fileCount = iterator_count($fi);
echo $fileCount; 

?>

main.js (EXTERNAL JS FILE) I don't have any code to do with my php file in my JS file yet. I would like to get the variable from my PHP file(http://www.website/numberOfImages.php) and use it (alert it) in my external JS file.

main.js(EXTERNAL JS FILE)我的JS文件中没有任何代码可以处理我的php文件。我想从我的PHP文件(http://www.website/numberOfImages.php)中获取变量并在我的外部JS文件中使用它(警告它)。

I'm willing to use AJAX.

我愿意使用AJAX。

2 个解决方案

#1

You may adopt one of 2 Possibilities... Option Nr. 1: You can expose the Number of Images as a Global Variable & Use it in your main.js (that is Assuming that main.js was included in the numberOfImages.php Script. Option Nr. 2 You can use Ajax to do that too:

您可以采用2种可能性之一...选项Nr。 1:您可以将图像数量公开为全局变量并在main.js中使用它(假设main.js包含在numberOfImages.php脚本中。选项Nr.2您也可以使用Ajax来执行此操作:

OPTION NR. 1

选项NR。 1

    <?php 
        //FILE =>numberOfImages.php:

        $dir = "/my/directory/";
        $fi = new FilesystemIterator($dir, FilesystemIterator::SKIP_DOTS);
        $fileCount = iterator_count($fi);

        // EXPOSE THIS VARIABLE TO JAVASCRIPT AS A GLOBAL VARIABLE..
        //echo $fileCount; 

    ?>
        // SOMEWHERE IN THE SAME FILE: numberOfImages.php:
        <script type="text/javascript">
            var _NUM_IMAGES = "<?php echo $fileCount; ?>"; 
        </script>

Now, you can access the Number of Images in the main.js by simply referencing the variable _NUM_IMAGES. So doing alert(__NUM_IMAGES) would work. However, be Sure that the main.js is included in the numberOfImages.php File

现在,您只需引用变量_NUM_IMAGES即可访问main.js中的图像数。所以做警报(__ NUM_IMAGES)会起作用。但是,请确保main.js包含在numberOfImages.php文件中

OPTION NR 2

选项NR 2

    // INSIDE YOUR HTML/PHP FILE THAT RUNS THE SHOW; IMPORT BOTH JQUERY & YOUR main.js BELOW. 
    // INCLUDE JQUERY LIBRARY: OTHERWISE THIS WON'T WORK...
    // SURE YOU CAN ALSO DO ALL THESE IN PURE JAVASCRIPT, BUT WHY RE-INVENT THE WHEEL???
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
    <script type="text/javascript" src="main.js"></script>

        //YOUR main.js COULD LOOK SOMETHING LIKE THIS:::
        jQuery.noConflict();
        (function ($) {
            $(document).ready(function(e) {
                $.ajax({
                    url: 'numberOfImages.php',     // <== POINTS TO THE VALID URL OF THE PHP FILE THAT OUTPUTS THE NUMBER OF IMAGES...
                    dataType: "HTML",
                    cache: false,
                    type: "POST",

                    //HANDLE THE SUCCESS CASE FOR THE AJAX CALL
                    success: function (data, textStatus, jqXHR) {
                        if(data){
                            alert(data);
                        }
                    },

                    //HANDLE THE FAILURE CASE FOR THE AJAX CALL
                    error: function (jqXHR, textStatus, errorThrown) {
                        console.log('The following error occured: ' + textStatus, errorThrown);
                    },

                    //HANDLE THE EVENT-COMPLETE CASE FOR THE AJAX CALL
                    complete: function (jqXHR, textStatus) {
                    }
                });
            });
        })(jQuery);

And the numberOfImages.php could look something like this. Exactly the same way you did it:

而numberOfImages.php可能看起来像这样。完全一样,你做到了:

        <?php

            /**
             * filename: numberOfImages.php
             */

            $dir        = "/my/directory/";
            $fi         = new FilesystemIterator($dir, FilesystemIterator::SKIP_DOTS);
            $fileCount  = iterator_count($fi);

            die($fileCount);

However, be informed that You need JQuery for this to work. You can add this to the File in which you are importing the main.js but before you import the main.js.

但是,请注意,您需要JQuery才能工作。您可以将其添加到要导入main.js的文件中,但在导入main.js之前。

#2

if your other javascript isn't from an external source you can do something like:

如果您的其他JavaScript不是来自外部来源,您可以执行以下操作:

<?php
$dir = "/my/directory/";
$fi = new FilesystemIterator($dir, FilesystemIterator::SKIP_DOTS);
$fileCount = iterator_count($fi);
?> 



<script type="text/javascript">var fileCount = "<?= $fileCount?>";</script>

<script type="text/javascript" src="main.js"></script>

    and then in the main.js use FileCount like so:

    alert("fileCount: " + fileCount);

#1