来自外部文件的jquery没有加载

时间:2015-02-17 17:31:28

标签: javascript jquery external

所以我知道这个问题已被多次询问,但即使看起来对我来说,我似乎也无法做到这一点。我的外部文件的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

1 个答案:

答案 0 :(得分:1)

这是一个范围问题。您必须将功能移到$(function() { ... })

之外

在JavaScript中,在函数中专门定义的任何内容通常都保留在函数中:

var x = 3;

(function() {
    var y = 1;
})();

console.log(x); // 3
console.log(y); // error

因此,如果您在函数中定义函数,则只能从您定义的函数中调用它。当尝试从其他任何地方调用它时,内部函数似乎未定义。

在您的情况下,您只需删除包装函数:

$(function() { // Delete this...

    ...

}); // And this

有关详情,请参阅You Don’t Know JS: Scope & Closures