jquery - 调整 load() 代码

Question

我试图调整这篇文章中的代码，解决方案是：

function animateTransition(event) {
    // load the html contained in the tag with id of #main
    $('#article-container').load('myArticle.html #main', function() {
        // load the css
        $('head').load('myCSS.css', function() {
            // load the js
            $.getScript('myScript.js', function() {
                console.log("Animating...");
                $('#content-container').addClass('animate');
                $('#article-container').addClass('animate');
            });
        });
    });
}

...提出我自己的版本：

<div id="menu_aEmpresa"
     onclick="$('#mainContent')
              .load('aEmpresa_pt.html #aEmpresa_mainContent > *', function(){
                $('head').load('css/aEmpresa.css'); // load the css
                $.getScript('js/aEmpresa.js'); // load the js
              });">
</div>

基本上我想加载外部文件（aEmpresa_pt.html）中引用的css和js文件，同时加载它的内容。但是，这种语法不起作用。请帮忙？

谢谢你。

佩德罗

Answer 1

这不是您应该使用 jquery 编码的方式。

您应该将 html 代码与 js/jquery 代码分开：

HTML

<div id="menu_aEmpresa"></div>

jQuery

<script>
    $(function(){
        $('#menu_aEmpresa').on('click',function(){
            $('#mainContent')
              .load('aEmpresa_pt.html #aEmpresa_mainContent > *', function(){
                $('head').load('css/aEmpresa.css'); // load the css
                $.getScript('js/aEmpresa.js'); // load the js
             });">
        });
    });
</script>