Databases
StackOverflow2013
Postsdbo
POIs there a better way to dynamically display iframes that contain random jquery bindings?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIs there a better way to dynamically display iframes that contain random jquery bindings?
    primarykey
    data
    text
    <p>This works, but I'm not sure why (and I'm fairly sure there's a smarter way to implement it). I have a page with an iframe that's src will change as needed. I'm trying to build this so different src's can be added later. After each src loads, I need to bind functionality to various elements. My main question is in the comments below; but in general, I'm curious about better ways to approach this. Thanks.</p> <pre><code>&lt;script type="text/javascript" src="/js/jquery-1.5.1.min.js"&gt;&lt;/script&gt; &lt;script language="javascript"&gt; $(document).ready(function() { $(".start").click(function(){ init(); }); function init() { $("#container").html('&lt;iframe id="myframe" src="testpage1.html" &gt;&lt;/iframe&gt;'); //QUESTIONS: //why do these bindings work when the iframe src changes? //at the time this is run, these don't know anything about the iframe src's that will be loaded //seems like it's acting like live() rather than bind()? //is it '$("#myframe").load(...)' ? Does that run everytime the iframe is loaded? //if so, why aren't the bindings doubling up everytime the same page loads? $("#myframe").load( function() { //make sure iframe is loaded- $('#myframe').contents().find('.page2Link').click(function(){ showPage('page2'); }); $('#myframe').contents().find('.page1Link').click(function(){ showPage('page1'); }); $('#myframe').contents().find('.page3Link').click(function(){ showPage('page3'); }); $('#myframe').contents().find('.whatever').click(function(){ showPage('page1'); }); }); } function showPage(id){ console.log('showing: ' + id); switch (id){ case 'page1': $("#myframe").attr("src","testpage1.html"); break; case 'page2': $("#myframe").attr("src","testpage2.html"); break; case 'page3': $("#myframe").attr("src","testpage3.html"); break; } } }); &lt;/script&gt; &lt;div id="container"&gt;&lt;/div&gt; &lt;a class="start"&gt;start&lt;/a&gt; </code></pre> <p>And the iframe src pages:</p> <p>page1</p> <pre><code> &lt;div class="page2Link"&gt;show page 2&lt;/div&gt; </code></pre> <p>page2</p> <pre><code>&lt;div class="page1Link"&gt;show page 1&lt;/div&gt; &lt;div class="page3Link"&gt;show page 3&lt;/div&gt; </code></pre> <p>page3</p> <pre><code>&lt;div class="whatever"&gt;show whatever page&lt;/div&gt; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USjbd
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. CONote: this kind of relates to a similar question i had: http://stackoverflow.com/questions/6798496/incrementing-variable-within-jquery-click
      singulars
      1. POIs there a better way to dynamically display iframes that contain random jquery bindings?
      1. USjbd
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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