外部文件中的jquery未加载

jquery from external file not loading

本文关键字:加载 jquery 文件 外部      更新时间:2023-12-11

所以我知道这个问题已经被问了很多次了,但我似乎无法解决这个问题,尽管它在我看来是正确的。我的jquery函数从外部文件加载不正确。

我的tableMethods.js外部文件看起来像

$(function(){
// Write FITS
function writeFits(){
    var data = $('.sastable').bootstrapTable('getData');
    var name = $('#fitsname').val();
    $.getJSON($SCRIPT_ROOT + '/writeFits', {'data':JSON.stringify(data),'name':name}, 
        function(data){
            $('#fitsout').text(data.result);
        }); 
}
// Delete rows from data table
function deleteRows(){
    var $table = $('.sastable');
    var $delete = $('#delete'); 
    var ids = $.map($table.bootstrapTable('getSelections'), function (row) {
            return row.id
    });
    $table.bootstrapTable('remove', {
            field: 'id',
            values: ids
    });
}
})

我的html标题看起来像

<script type="text/javascript" src="/static/js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/js/bootstrap-table.js"></script>
<script type='text/javascript' src="/static/js/tableMethods.js"></script>

当我检查检查器时,当我点击看起来像的按钮时,它说文件已经加载

<button id="delete" class="btn btn-danger" type='button' onClick='deleteRows()'>Delete Rows</button>

我得到错误

Uncaught ReferenceError: deleteRows is not defined

这是一个作用域问题。您必须将您的功能转移到$(function() { ... }) 之外

在JavaScript中,任何只在函数中定义的东西,通常都停留在函数中:

var x = 3;
(function() {
    var y = 1;
})();
console.log(x); // 3
console.log(y); // error

因此,如果你在一个函数中定义一个函数,你只能从你定义的函数中调用它。当你试图从其他地方调用它时,内部函数似乎是未定义的。

在您的情况下,您可以简单地删除包装器函数:

$(function() { // Delete this...
    ...
}); // And this

欲了解更多信息,请阅读《你不知道JS:Scope&关闭