Question

我想通过ajax加载.php文件，这些文件在加载时执行ExtJS脚本，这反过来又修改了DOM中已存在的现有ExtJS对象。

但是，我甚至无法从通过Ext.Ajax.request加载的页面执行Javascript。并且Firebug Net面板中没有出现任何错误。 PHP代码被执行，但不是Javascript。当我在浏览器中调用自己加载的页面时，它会执行Javascript。

如何在使用Ext.Ajax.request加载的页面中执行Javascript？

Ext.onReady(function(){

    var menuItemStart = new Ext.Panel({
        id: 'panelStart',
        title: 'Start',
        html: 'This is the start menu item.',
        cls:'menuItem'
    });

    var menuItemApplication = new Ext.Panel({
        id: 'panelApplication',
        title: 'Application',
        html: 'this is the application page',
        cls:'menuItem'
    });

    var regionMenu = new Ext.Panel({
        region:'west',
        split:true,
        width: 210,
        layout:'accordion',
        layoutConfig:{
            animate:true
        },
        items: [ menuItemStart, menuItemApplication ]
    });

    var regionContent = new Ext.Panel({
        id: 'contentArea',
        region: 'center',
        padding:'10',
        autoScroll: true,
        html: 'this is the content'
    });

    new Ext.Viewport({
        layout: 'border',
        items: [ regionMenu, regionContent ]
    });

    menuItemStart.header.on('click', function() {
       Ext.Ajax.request({
           url: 'content/view_start.php',
           success: function(objServerResponse) {
               regionContent.update(objServerResponse.responseText);
           }
       });
    });

    menuItemApplication.header.on('click', function() {
       Ext.Ajax.request({
           url: 'content/view_application.php',
           success: function(objServerResponse) {

               regionContent.update(objServerResponse.responseText);
           }
       });
    });
});

通过Ajax加载的文件：

<script type="text/javascript">
    window.onload=function() {
        alert('from application view'); //is not executed
    }

    //Ext.onReady(function(){
    //    alert('from application view extjs'); //is not executed
    //}
</script>
<?php
echo 'this is the application view at ' . date('Y-m-d h:i:s');
?>

Answer 1

当你得到ajax响应时，窗口上的onload事件已经被触发，因此不会执行该函数，因为onload事件不会再被触发。请尝试使用警报：

<script type="text/javascript">
    alert('from application view');
</script>
<?php
echo 'this is the application view at ' . date('Y-m-d h:i:s');
?>

<强>更新

浏览器不会以这种方式执行注入的脚本，因此您可以尝试使用以下内容：

var scripts, scriptsFinder=/<script[^>]*>([\s\S]+)<\/script>/gi;
while(scripts=scriptsFinder.exec(responseText))
{
   eval(scripts[1]);
}

Answer 2

您是否尝试将第二个参数的true传递给Panel.load（恰好是 loadScripts 选项）？

regionContent.update(objServerResponse.responseText, true);

Answer 3

通常情况下，当您使用ext调用update时，您就可以了 update（string，true），它将执行字符串中包含的脚本。但是，ext core似乎缺少此功能，但没有更新方法的文档（我必须搜索实际代码以确认这一点。）

如果您使用的是常规EXT（例如ext-all），您只需添加

即可

regionContent.update(objServerResponse.responseText,true);

像这样，它应该评估脚本。不过对我来说没有骰子 - ext-all太慢但我需要eval功能。我可能不得不攻击EXT。

为什么javascript不会在用Ext.Ajax.Request加载的.php文件中执行？

3 个答案: