Question

我正在创建我为一些网站制作的CMS修订版。

在这个重新设计的版本中，左侧有一个列表，显示您可以管理的不同部分（文本，照片库等）。在右侧，我想在用户选择项目时通过AJAX加载适当的UI。

我开始只是简单地向各种文件发出请求，并将div推送到div中，如下所示：

var map;
$(document).ready(function() {
    map = {"text":"txt_interface.php","gallery":"gallery_interface.php"};

    $('#left_pane li').click(function() {
        var id = $(this).attr('id');
        if (map[id].length) {
            // show loading stuff etc.
            var url = 'ajax/'+map[id];
            $.ajax({
                url: url,
                type: 'GET',
                success: function(res) {
                    $('#right_content').html(res);
                }
            });
        }
    });
});

然而，我意识到某些页面需要外部JS（例如tinyMCE）。所以，我尝试了各种解决方案，例如分别在JSON中传递js引用并使用$.getScript，但这一切都变得非常复杂。

最好不使用框架，实现这一目标的最简单方法是什么？

Answer 1

你可以将你的JavaScript放在一个可以在你的AJAX回调函数和eval中拉出的块中（我知道谷歌做了类似的事情来推迟解析某些JavaScript）：

        $.ajax({
            url: url,
            type: 'GET',
            success: function(res) {
                var tmp    = res.split("{script}"),
                    code   = tmp[1].split("{/script}")[0];
                eval(code);
                $('#right_content').html(tmp[0]);
            }
        });

这是一个jsfiddle：http://jsfiddle.net/4HReW/

这假设您使用{script} / {/script}代替常规<script> / </script>标记，并且JavaScript块出现在所引入内容的末尾通过AJAX。

使用ajax加载迷你接口

1 个答案: