[英]append object to specific dynamic div jquery
要附加的元素(用于div特殊子级):
<object width="305" height="20" data="player.swf" type="application/x-shockwave-flash">
<param value="transparent" name="wmode"><param value="player.swf" name="music">
<param value="mp3=http://linkfrom/a/songs.mp3&loop=1&autoplay=1&showvolume=1&autostart=true&width=305" name="FlashVars">
</object>
到此ID之一。
<div id="div1">
<a id="link1" href="http://linksto.com/songs1.mp3">hide</a>
<div id="showhere1"></div>
</div>
<div id="div2">
<a id="link2" href="http://linksto.com/songs2.mp3">hide</a>
<div id="showhere2"></div>
</div>
<div id="div3">
<a id="link3" href="http://linksto.com/songs2.mp3">hide</a>
<div id="showhere3"></div>
</div>
说我单击id =“ link1”的第一个链接,新元素将添加到其中,文本链接将更改为“ hide”。 点击后查看示例:
<div id="div1">
<a id="link1" href="http://linksto.com/songs1.mp3">hide</a>
<div id="showhere1"><object data="player.swf" type="application/x-shockwave-flash"><param value="transparent" name="wmode"><param value="player.swf" name="music"><param value="mp3=http://www.radiosalomon.si/scripts/player/7.mp3&loop=1&autoplay=1&showvolume=1&autostart=true&width=305" name="FlashVars"></object></div>
</div>
<div id="div2">
<a id="link2" href="http://linksto.com/songs2.mp3">show</a>
<div id="showhere2"></div>
</div>
<div id="div3">
<a id="link3" href="http://linksto.com/songs2.mp3">show</a>
<div id="showhere3"></div>
</div>
如果我没看错,您想在每个链接后追加播放器。 为此,您可以使用以下脚本:
jQuery('a').click(function(){
event.preventDefault()
var id = jQuery(this).attr('id');
if(jQuery(this).text() == 'show'){
console.log( jQuery(this).next('div'));
jQuery(this).next('div').html('<object data="player.swf" type="application/x-shockwave-flash"><param value="transparent" name="wmode"><param value="player.swf" name="music"><param value="mp3=http://www.radiosalomon.si/scripts/player/7.mp3&loop=1&autoplay=1&showvolume=1&autostart=true&width=305" name="FlashVars"></object>');
jQuery(this).text('hide')
}else{
jQuery(this).next('div').html('')
jQuery(this).text('show')
}
});
您可以根据代码更改对象值。
这是演示: http : //jsfiddle.net/xEKcz/
希望对您有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.