Note that there are some explanatory texts on larger screens.

plurals
  1. POafter ajax complete, load <script> tags but only ones with specific id's
    primarykey
    data
    text
    <p>I'm currently using infinite-scroll to load more content, the content has <code>&lt;script&gt;</code> tags that need to be ran. So I'm using the code below as an <code>ajax-callback</code>:</p> <p><strong>JS</strong> on load ajax callback:</p> <pre><code>function ajaxLoadedCallback() { // contentElem is the HTML element you've loaded via ajax scriptx = document.getElementsByTagName("script"); // Load scripts into new array because // scriptx seems to change as scripts execute, at least in some browsers scripts = new Array(); for (var idx=0; idx&lt;scriptx.length; idx++) { if (jQuery(scriptx[idx]).is("#inline-comments")) { scripts[idx] = scriptx[idx].text; } } console.log (scripts[idx]); // execute each script in turn for(idx=0; idx&lt;scripts.length; ++idx) { if (scripts[idx].length!=0) { try { // create a function for the script &amp; execute it f = new Function(scripts[idx]); f(); } catch(se) { } // end try-catch } // end if } // end for } </code></pre> <p>Each content post has this script tag I want to load:</p> <pre><code>&lt;script id="inline-comments" &gt; console.log ('&lt;?php echo $post-&gt;ID; ?&gt;' + 'has loaded...'); var tid_&lt;?php echo $post-&gt;ID; ?&gt; = setInterval( function () { if ( document.readyState !== 'complete' ) return; clearInterval( tid_&lt;?php echo $post-&gt;ID; ?&gt; ); inline_comments_ajax_load(&lt;?php echo $post-&gt;ID; ?&gt;) }, 100 ); &lt;/script&gt; </code></pre> <p>Getting an Uncaught TypeError: Cannot read property 'length' of undefined error on this line: <code>if (scripts[idx].length!=0) {</code></p> <p>The ajax call back loads at the right time, but breaks because I assume <code>scripts[idx]</code> is empty. but why? when I use <code>console.log()</code> it shows when the <code>scriptx[idx]</code> has an id and the name of the id.</p> <p><strong>UPDATE</strong> Thank you PSL! <code>console.log</code> shows that it is finding the scripts, but scripts.length is returning zero</p> <pre><code>function ajaxLoadedCallback() { scriptx = document.getElementsByTagName("script"); scripts = new Array(); for (var idx=0; idx&lt;scriptx.length; idx++) { if (jQuery(scriptx[idx]).is(".inline-comments-script")) { console.log (".inline-comments-scriptfound!"); console.log ("####### .text #######"); console.log (scriptx[idx].text); console.log ("####### .innerHTML ######"); console.log (scriptx[idx].innerHTML); scripts.push = scriptx[idx].innerHTML; } } console.log ("####### END ######"); console.log ("Found "+scripts.length+ " script(s)"); // execute each script in turn for(idx=0; idx&lt;scripts.length; ++idx) { var content = scripts[idx]; if (content.length) { try { // create a function for the script &amp; execute it f = new Function(content); f(); } catch(se) { } // end try-catch } // end if } // end for } </code></pre> <p>Works now! See PSL's answer below - you can also see it live if you have wordpress: <a href="https://github.com/MattMcFarland/inline-ajax-comments" rel="nofollow">https://github.com/MattMcFarland/inline-ajax-comments</a> - works great!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload