我需要在$('.mp3').show();
执行后再次运行此代码。
$('.mp3').click(function() {
$(this).toggle(function() {
$('object').remove();
$('.mp3-0').show();
});
});
$('.mp3-0').click(function() {
$(this).toggle(function() {
$('#mp3obj').replaceWith('<object width="0" height="0"> <param name="src" value="musicasite.mp3"> <param name="autoplay" value="false"> <param name="controller" value="true"> <param name="bgcolor" value="#FFFFFF"> <embed src="musicasite.mp3" autostart="false" loop="false" width="0" height="0" controller="true" bgcolor="#FFFFFF"></embed> </object>');
$('.mp3').show();
});
});
这整个代码片段正在为我做的是在用户请求时从网站上删除一首歌曲,但如果该用户想要它,那么音乐会再次播放。
但是,在代码运行这么久之后它就会停止工作。
我需要的是:整个HTML文件需要像点击按钮并运行代码之前一样进行设置。
-----编辑------
这里可以看到一个例子:http://dev.webtoad.com.br/toquedemagica/2012/
该页面是巴西葡萄牙语,但如果你点击'Paraldúsica'和'Tocarmúsica',你可以看到我到目前为止所取得的成就。
答案 0 :(得分:2)
你犯了两大错:
1。你没有使用正确切换。您只想切换按钮可见性而不是按钮行为。那应该是$(this).toggle()
,然后是切换功能之外的其他动作。当您点击两个不同的按钮时,根本没有使用切换的意义,因为它可能会让您进入意外的显示/隐藏行为。
2。在.mp3-0
点击(第二次点击),您想要(重新)添加您在上一次点击后删除的<object>
#mp3obj
1}},而不是替换它。这就是代码只运行3次点击的原因;
停止 - 删除<object>
。
START - 将#mp3obj
替换为<object>
。
停止 - 再次移除<object>
。
START - ...找不到#mp3obj
替换为<object>
(您替换了它!) - 功能停止工作...
请改为尝试:
$('.mp3').click(function() {
$(this).hide();
$('object').remove();
$('.mp3-0').show();
});
$('.mp3-0').click(function() {
$(this).hide();
$('#mp3obj').html('<object width="0" height="0"> <param name="src" value="musicasite.mp3"> <param name="autoplay" value="false"> <param name="controller" value="true"> <param name="bgcolor" value="#FFFFFF"> <embed src="musicasite.mp3" autostart="false" loop="false" width="0" height="0" controller="true" bgcolor="#FFFFFF"></embed> </object>');
$('.mp3').show();
});