【问题标题】:Undefined error for file upload if js is included in home page如果主页中包含js,则文件上传未定义错误
【发布时间】:2017-08-18 10:10:52
【问题描述】:

我在我的网页中使用 blueimp jquery 文件上传。我在主页的 head 标记中包含所有 css 和 js 文件。我有一个包含许多菜单的左侧菜单。单击 menu1 时,它将发送一个 ajax 请求,响应将设置在 div menuContent 中。

<head>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="file_upload_style.css">
<link rel="stylesheet" href="jquery_file_upload.css">
<script src="jquery_ui_widget.js"></script>
<script src="jquery_iframe_transport.js"></script>
<script src="jquery_file_upload.js"></script>
</head>
<div id="menuContent" class="menuContent"></div>

响应包含带有相应 jquery 文件上传代码的上传按钮。

<span class="btn btn-success fileinput-button w3-margin-bottom  ">
    <i class="glyphicon glyphicon-plus"></i>
    <span>Upload</span>
    <input id="uploadXLSXFile" type="file" name="files">
</span>
<script type="text/javascript">
$(function () {
    'use strict';   
    $('#uploadXLSXFile').fileupload({
        add: function(e, data) {
            var uploadErrors = [];
            if (!(/\.(xlsx)$/i).test(data.originalFiles[0].name)) {
                return false;
            }
            data.submit();
        },
        url: "UploadHandler.php", 
        dataType: 'json',
        acceptFileTypes : /(\.|\/)(xlsx)$/i,
        done: function (e, data) {

        }
    }).prop('disabled', !$.support.fileInput)
        .parent().addClass($.support.fileInput ? undefined : 'disabled');   
});

</script>

当我点击 menu1 时,此响应将设置为 div,但我收到类似的错误

未捕获的类型错误:$(...).fileupload 不是函数

如何在ajax响应中访问主页中添加的js?谁能帮我解决这个问题?

提前致谢。

【问题讨论】:

    标签: javascript php jquery ajax jquery-file-upload


    【解决方案1】:

    将脚本附加到您的标题中,例如:

    var s = document.createElement("script");
    s.type = "text/javascript";
    s.src = "http://somedomain.com/somescript";
    $("head").append(s);
    

    或者你可以使用 JQuery 的 getScript()

    $.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
      console.log( data ); // Data returned
      console.log( textStatus ); // Success
      console.log( jqxhr.status ); // 200
      console.log( "Load was performed." );
    });
    

    【讨论】:

    • ajax请求调用一个php文件。那么在这种情况下会起作用吗?
    • getScript 仅适用于 js 代码,但您可以在上传 php 结果后使用第一种方法
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-01-05
    • 2011-02-22
    • 1970-01-01
    • 1970-01-01
    • 2017-08-12
    • 2015-07-20
    • 2012-02-02
    相关资源
    最近更新 更多