Tom Gullen
Tom Gullen

Reputation: 61739

jQuery why is this loop running twice?

$(document).bind("ready", function(){

    // Loop each construct tag
    $('construct').each(
            alert('running');

        function ()
        {
            // Grab data
            var jC2_events = $(this).html().split('\n');
            $(this).html('');

            // Data
            var jC2_html = '';

            // Add wrapper tags
            jC2_html += '<div class="jC2_Outer">';
            jC2_html += '<div class="jC2_Toolbar">';
            jC2_html += '<a href="#" class="jC2_ToolbarA">Plain Text</a>';
            jC2_html += '<a href="#" class="jC2_ToolbarA">Help</a>';
            jC2_html += '</div>';
            jC2_html += '<div class="jC2_Container">';

            // Loop each event
            for(var jC2_looper = 0; jC2_looper < jC2_events.length; jC2_looper++)
            {           
                // Split event into components
                var jC2_components = jC2_events[jC2_looper].split(':');

                // Event wrapper
                jC2_html += '<div class="jC2_EventNum">' + (jC2_looper + 1) + '</div>'
                jC2_html += '<div class="jC2_EventWrapper">';
                    jC2_html += '<div class="jC2_EventObject">' + jC2_components[0].trim() + '</div>';
                    jC2_html += '<div class="jC2_EventBreak"></div>';
                    jC2_html += '<div class="jC2_EventDesc">' + jC2_components[1].trim() + '</div>';        
                jC2_html += '</div>';

                // Actions
                jC2_html += '<div class="jC2_ActionWrapper">';

                // Loop remaining params
                for(var jC2_looper2 = 2; jC2_looper2 < jC2_components.length; jC2_looper2++)
                {
                    var jC2_actionClass;
                    if((jC2_looper2%2) == 0){
                        jC2_actionClass = 'jC2_Odd';
                    }else{
                        jC2_actionClass = 'jC2_Even';
                    }

                    jC2_html += '<div class="jC2_ActionLeft"></div>';
                    jC2_html += '<div class="jC2_ActionDesc ' + jC2_actionClass + '">' + jC2_components[jC2_looper2].trim() + '</div>';
                    jC2_html += '<div class="jC2_Clear"></div>';
                }               

                jC2_html += '</div><div class="jC2_Clear"></div>';
            }

            // End wrappers
            jC2_html += '</div>';
            jC2_html += '<div class="jC2_FooterInfo"><div class="jC2_Scirra"><a class="jC2_AS" href="http://www.scirra.com">Scirra.com</a> - Software in Motion</div>Generated with <a class="jC2_AF" href="http://www.scirra.com">JConstruct 1.0</a></div>';
            jC2_html += '</div>';
            $(this).html(jC2_html);
        }
    );

});

And my HTML page:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.<br /><br />

<construct>
System:Every tick:Set width to Y-100:Set angle to Atan(Self.X-Mouse.X):Finish it
Sprite:On event:Do this:Do that:Do something else
Clock:Ticks and chimes:Do something:Do it again!:Add one
</construct>

<br /><br />When an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

I'm just trying to loop every tag and render it's data contents as a nicely formatted HTML but am having trouble parsing the data into individual lines, and having trouble because this loop appears to be running twice when I put an alert in it.

Upvotes: 0

Views: 1537

Answers (2)

Variant
Variant

Reputation: 17365

The alert shouldn't be outside of the function.

Upvotes: 0

joshcomley
joshcomley

Reputation: 28808

// Loop each construct tag
$('construct').each(
        alert('running');

    function ()
    {

Should read:

// Loop each construct tag
$('construct').each(
    function ()
    {
        alert('running');

It's currently invalid and may cause unexpected and inconsistent behaviour in different browsers.

See http://jsfiddle.net/uBFAK/

Upvotes: 1

Related Questions