Question

我正在使用onClick（）编写一个jQuery文件作为按钮的事件。但我想从外部js文件加载另一个js函数。我怎样才能做到这一点？我一直在尝试，但没有结果

这是我的main.js

$(document).ready(function(){
    $("#dashboard").on("click", function(event){
        event.preventDefault();
        $('#content').html(dashboardTemplate);
        // I want another js external file will be loaded here

    });
});

这是我的外部js文件：元素#btnAddGroup位于dashboardTemplate里面，它只是一个html文件

    $("#btnAddGroup").on("click", function (event) {
        event.preventDefault();
        alert('test');
    });

谢谢

编辑：根据您的建议

external.js

function addGroup(){
    $("#btnAddGroup").on("click", function (event) {
        event.preventDefault();
        alert('test');
    });
}

main.js

$(document).ready(function(){
    $("#dashboard").on("click", function(event){
        event.preventDefault();
        $('#content').html(dashboardTemplate);
         $.getScript('external.js', function() {
            addGroup();
        });

    });

}）;

它仍然无法正常工作。我正在尝试排除故障。再次感谢

Answer 1

你可以这样试试

说这是你external.js档

function () funcEx(){
     console.log("This is logging from external function");
    }

您可以通过这种方式调用external.js文件中的main.js文件的功能。说这是你的main.js文件

$.getscript("path/to/jsFile",function(){
 funcEx();
});

希望你能得到一个想法

Answer 2

您尝试将事件侦听器添加到尚未存在的元素，因为在您单击创建btnAddGroup元素之前正在加载外部文件，因此该事件永远不会被附加并触发，但是您可以添加onClick监听器来记录文件并检查你是否点击了正确的元素，使用jquery 1.7+它将如下所示：

$(window).on("click", "#btnAddGroup", function (event) {
   event.preventDefault();
   alert('test'); 
 });

OnClick（）从外部js文件调用Jquery函数

2 个答案: