Неопределенная ошибка при загрузке файла, если js включен на домашнюю страницу

Я использую blueimp jquery fileupload на своей веб-странице. Я включаю все файлы 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>

Когда я нажимаю на меню1, этот ответ будет установлен в div, но я получаю сообщение об ошибке, например

Uncaught TypeError: $(...).fileupload не является функцией

Как я могу получить доступ к js, добавленному на домашнюю страницу, и в ответе ajax? Может ли кто-нибудь помочь мне исправить это?

Заранее спасибо.


person Jenz    schedule 18.08.2017    source источник


Ответы (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." );
});
person Marco Salerno    schedule 18.08.2017
comment
Запрос ajax вызывает файл php. Так будет ли это работать в таком случае? - person Jenz; 18.08.2017
comment
getScript предназначен только для кода js, но вы можете использовать первый подход после загрузки результата php. - person Marco Salerno; 18.08.2017