multiple instances of the same jquery script -
if have script needs run multiple times on page, in cms example, how approach this? in 1 experiment had code run multiple times put article id on end of selectors fire off commands , needed manipulated. it's not workaround though cause there's duplication of code (even though works).
here example got in recent stack overflow discussion (with article ids appended(textpattern)):
<script type="text/javascript"> $(document).ready(function() { $('.fulltracksinner<txp:article_id />').hide(); $('.tracklist<txp:article_id />').click(function() { $('.fulltracksinner<txp:article_id />').slidetoggle('medium'); if ($('.fulltracksinner<txp:article_id />').is(':hidden')) { $(this).text('show tracklist'); } else { $(this).text('hide tracklist'); } }); }); </script>
just imagine example 3 slideshows on page using same slideshow script.
this relatively common task in jquery. in order work multiple elements on same page without requiring unique ids, need use $(this)
in order define relative element you're acting on. don't know you're markup looks like, following:
$(document).ready(function() { $('.fulltracksinner<txp:article_id />').hide(); $('.tracklist<txp:article_id />').click(function() { $(this).children('.fulltracksinner<txp:article_id />').slidetoggle('medium'); if ( $(this).children('.fulltracksinner<txp:article_id />').is(':hidden') ) { $(this).text('show tracklist'); } else { $(this).text('hide tracklist'); } }); });
you should modify selectors little though, think $('.tracklist<txp:article_id />')
might choke in browsers.
Comments
Post a Comment