Question

我正在尝试使用一组文本框来定义JavaScript文件中的一些数据。因此，在文本框中输入一个团队名称“团队名称”，javascript文件使用此文本框存储团队名称，以便打印一组锦标赛括号。

javascript文件包含在我的<head>中，因此在我实际在文本框中输入数据之前加载它。我有这个代码用于html中的按钮，如下所示：

script(type='text/javascript')
    $('#buttontest').click(function() {
        $('div.bracket').show();
        $('div.teamList').hide();
    });

因此，当按下按钮时，文本框全部隐藏，并且应显示带有用户定义的团队名称的括号....这是我的javascript文件末尾的代码：

$(function() {
    $('#singleElim8').bracket({
        init: singleElim8Data
    })
  $('.bracket').hide();
});

所以在div.bracket中我有javascript使用的类＃singleElim8。但是我如何更改它以便初始化括号的javascript仅在单击按钮后才会运行？这样，括号在文本框填写完之后就会呈现。任何帮助都会受到赞赏。

Answer 1

只需使用getScript method of jQuery

即可

使用起来非常简单

$( '#buttontest' ).on( 'click', function() {
    $.getScript( 'url to your js file', function( data, textStatus, jqxhr ) {
        // do some stuff after script is loaded
    } );
} );

Answer 2

当您将函数作为参数传递给jQuery时，它将在document.ready（）期间执行该函数。它允许您的页面在执行之前加载所有脚本。

$(function() {
    $('#buttontest').click(function() {
        $('div.bracket').show();
        $('div.teamList').hide();
    });

    $('#singleElim8').bracket({
        init: singleElim8Data
    })
  $('.bracket').hide();
});

单击按钮后加载javascript文件

2 个答案: