TypeError: $(...).dropzone 不是函数答案

【问题标题】：TypeError: $(...).dropzone is not a functionTypeError: $(...).dropzone 不是函数
【发布时间】：2019-09-29 14:57:02
【问题描述】：

我正在尝试在我的 django 应用程序中使用 dropzone，我遵循了很多示例，但没有一个对我有用你能帮帮我吗

js代码：

     <script src="https://code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
      <link href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.css" rel="stylesheet" type="text/css" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.js" type="text/javascript"></script>
      <script type="text/javascript">
      Dropzone.autoDiscover = false;
        $(document).ready(function(){
            $('#myDropzone').dropzone({
                url: "{% url 'dashboard/import' %}",
                addRemoveLinks: true,
                success: function (file, response) {
                    console.log("Successfully uploaded");
                },
                error: function (file, response) {
                    console.log("something goes wrong");
                }
            });
     });
     </script>

HTML 代码：

<form action="{% url 'dashboard/import' %}" class="dropzone">
     {% csrf_token %} 
</form>

我有一个 TypeError: $(...).dropzone is not a function

【问题讨论】：

标签： django dropzone.js

【解决方案1】：

通过查看相关的javascript文件，函数名dropzone以大写字母开头。所以试试下面的大写函数：

 $(document).ready(function(){
        $('#myDropzone').Dropzone({
            url: "{% url 'dashboard/import' %}",
            addRemoveLinks: true,
            success: function (file, response) {
                console.log("Successfully uploaded");
            },
            error: function (file, response) {
                console.log("something goes wrong");
            }
        });

【讨论】：

【解决方案2】：

试试这个：

window.onload = function() {
    Dropzone.autoDiscover = false;
    $('#myDropzone').dropzone({
            url: "{% url 'dashboard/import' %}",
            addRemoveLinks: true,
            success: function (file, response) {
                console.log("Successfully uploaded");
            },
            error: function (file, response) {
                console.log("something goes wrong");
            }
        });
   }

【讨论】：