Question

我的代码基于Javascript - Retrieve names of files in a folder中的示例代码，使用jquery-1.11.2显示文件列表，但使用jquery-3.3.1显示任何文件列表，并且ol标签显示项目符号列表而不是编号列表。

我创建了以下代码并将其放在CENTOS 6 / Apache服务器上。它完美显示了文件列表，但错误地将其格式化为项目符号列表而不是编号列表。另外，当我尝试使用jquery 3.3.1运行它时，代码什么也没显示。

请参见https://twirlers.bobhurt.com/showfiles.html上的工作版本。

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Show Files</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
</head>
<body>
    <div class="container-fluid">
        <div id='fileNames'></div>
    </div>
</body>

<!--
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
-->
    <script src="js/jquery-1.11.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<script>//<![CDATA[
    $(window).load(function(){
        var $filedata = [
            [".pdf", "Printable PDF Template Files"],
            [".svg", "Scalable Vector Graphic Source Files for Editing in Inkscape"]
            ];
        var $folder = "assets/";

            $(document).ready(function(){

                $.ajax({
                    //This will retrieve the contents of the folder if the folder is configured as 'browsable'
                    url: 'assets/',
                    success: function (data) {
                        console.log(data);
                        $("#fileNames").html('<br>');
                        for (var i = 0; i < $filedata.length; i++) {
                            $("#fileNames").append('<h3>'+ $filedata[i][1]+'</h3>');
                            $("#fileNames").append('<ol>');
                            $(data).find("a:contains(" + $filedata[i][0] + ")").each(function () {
                                $("#fileNames").append( '<li><a href="'+$folder+$(this).text()+'">'+$(this).text()+'</a></li>');
                            });
                            $("#fileNames").append('</ol>');
                        }
                    }
                });

            });
    });
    //]]>
    </script>

我希望使用jquery 3.3.1的代码显示文件列表，但是什么也不显示，也没有错误消息。

我希望对文件列表进行编号，因为我使用了ol标记，但是代码显示了带有项目符号的项目。

所以，问题：

如何使脚本与jquery-3.3.1一起使用？
如何使文件列表编号而不是项目符号编号？

Answer 1

在头上

<script type="text/javascript" src="/jquery-1.11.2.js"></script>
<script type="text/javascript">
    var $ver1JQ = jQuery.noConflict();
</script>
<script type="text/javascript" src="/jquery-3.3.1.js"></script>
<!-- the version 3 in now in $ while the 1 is in $myJQ -->

在版本3中可以保留全局$

(function($){
    //inside this function, using $ means using the global $myJQ
    $('#selector')...
})($ver1JQ);

请参见此链接https://api.jquery.com/jquery.noconflict/，该链接可帮助您尝试解决问题。

如何使此jquery 1.11脚本在jquery 3.3中工作

1 个答案: