Why would javascript eval work in chrome, safari, but in firefox only when firebug on?

Thanks to this answer I was able to get javascript to execute when being loaded via an ExtJS AJAX call.

However, the following code does not work the same in all browsers (on mac):

  • chrome: works, alert pops up
  • safari: works, alert pops up
  • firefox: works, but only when Firebug is enabled, when Firebug is not enabled, the script is ignored

How can I get javascript to execute via AJAX call in Firefox without having Firebug installed?

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) {
                var responseText = objServerResponse.responseText;
                console.log(responseText);
                regionContent.update(responseText);
                var scripts, scriptsFinder=/<script[^>]*>([\s\S]+)<\/script>/gi;
                while(scripts=scriptsFinder.exec(responseText)) {
                    eval(scripts[1]);
                }
            }
        });

    });
});

The base that is being loaded:

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

Answers


console.log is your culprit.

Whenever you're logging in JavaScript, it's a good idea to check if console exists before calling it's functions:

if(window.console) console.log('whatever');

That way, it will only execute when the console is available.


console.log(responseText);

this line seems problematic to me. console exists only when Firebug is on, so you'll have to comment it, or do some checking whether it exists before using it.


Need Your Help

Java GUI Toolbar

java user-interface swing awt

I am developing a Java Desktop Application. In that I want some toolbars at the top of the JFrame (as in usual GUI appllications).

Output the difference in character XSLT

xml xslt xslt-1.0 lxml

I have two variables $word1 and $word2 and the values are:

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.