从javascript生成的li a元素触发onclick

Trigger onclick from javascript-generated li a element

本文关键字：元素 onclick li javascript      更新时间：2024-01-24

在我的网站www.danielLmusic.com的收听部分，当点击j播放器播放列表中的一个项目时，我正试图激活唱片播放器手臂动画gif（recordstart.gif）。困难在于，播放列表元素是通过javascript加载的，而对.jp播放列表lia的正常引用是不起作用的。我浏览了一下这个网站，发现有人建议使用on('click','a',function(){功能，这让我获得了75%的支持，只是它只从用户点击歌曲的第二次加载gif，而不是第一次。我粘贴了下面的html和javascript。。。任何帮助都将不胜感激！谢谢

<div class="jp-playlist">
                              <ul>
                                <li></li> <!-- Empty <li> so your HTML conforms with the W3C spec -->
                              </ul>
                            </div>
<script type="text/javascript">
    $(window).load(function(){
        $('.jp-playlist ul').on('click','a',function(){
       $('.jp-playlist a').click(function(){
          $('#soundsystem').css('background-image','url(graphics/recordstart.gif)');
           setTimeout(function (){ 
               $('#soundsystem').css('background-image','url(graphics/recordplaying.gif)');
           },1500);

       });
       $('a.jp-pause').click(function(){
           $('#soundsystem').css('background-image','url(graphics/recordstop.gif)');
       });
       $('a.jp-stop').click(function(){
          $('#soundsystem').css('background-image','url(graphics/recordstop.gif)');
       });
   });
});
    </script>

try this:
<script type="text/javascript">
    $(window).load(function(){
        $('body').on('click','.jp-playlist ul a',function(){
       $('.jp-playlist a').click(function(){
          $('#soundsystem').css('background-image','url(graphics/recordstart.gif)');
           setTimeout(function (){ 
               $('#soundsystem').css('background-image','url(graphics/recordplaying.gif)');
           },1500);

       });
       $('a.jp-pause').click(function(){
           $('#soundsystem').css('background-image','url(graphics/recordstop.gif)');
       });
       $('a.jp-stop').click(function(){
          $('#soundsystem').css('background-image','url(graphics/recordstop.gif)');
       });
   });
});
    </script>
相关文章：