我需要一个链接，以便能够下载本地wordpress播放列表中的每个音频文件项。

我使用了此线程中的脚本>>Download button for wp audio player

但是没有能力向海报提问。我刚刚使用了DaveRomsey的底部脚本，并将其放置在自定义脚本插件中。我这样做是不是错过了什么？这会在播放列表项目的右侧生成一个下载图标，并处于悬停状态，但单击时只会启动播放列表项目。

<script>
/**
 * Our custom playlist template for mp3 download`.
 */
function wpse_141767_wp_underscore_playlist_templates() {
?>
<script type="text/html" id="tmpl-wp-playlist-current-item">
    <# if ( data.image ) { #>
    <img src="{{ data.thumb.src }}"/>
    <# } #>
    <div class="wp-playlist-caption">
            <span class="wp-playlist-item-meta wp-playlist-item-title">&#8220;{{ data.title }}&#8221;</span>
            <# if ( data.meta.album ) { #><span class="wp-playlist-item-meta wp-playlist-item-album">{{ data.meta.album }}</span><# } #>
            <# if ( data.meta.artist ) { #><span class="wp-playlist-item-meta wp-playlist-item-artist">{{ data.meta.artist }}</span><# } #>
    </div>
</script>
<script type="text/html" id="tmpl-wp-playlist-item">
    <div class="wp-playlist-item">
            <a class="wp-playlist-caption" href="{{ data.src }}">
                    {{ data.index ? ( data.index + \'. \' ) : \'\' }}
                    <# if ( data.caption ) { #>
                            {{ data.caption }}
                    <# } else { #>
                            <span class="wp-playlist-item-title">&#8220;{{{ data.title }}}&#8221;</span>
                            <# if ( data.artists && data.meta.artist ) { #>
                            <span class="wp-playlist-item-artist"> &mdash; {{ data.meta.artist }}</span>
                            <# } #>
                    <# } #>
            </a>
            <# if ( data.meta.length_formatted ) { #>
<div class="wp-playlist-item-length"><span>
        <a href="{{ data.src }}"><i class="fa fa-download" title="Download" aria-hidden="true"></i></a>
    </span>{{ data.meta.length_formatted }}</div>
            <# } #>             
    </div>
</script>
<?php
}
</script>

但是，如前所述（在该线程中），图标不会开始下载，它只是激活播放列表项的播放功能。我尝试将下载图标部分移到div下面（如果可能，我仍然希望它处于原始位置），希望将跨度移到div之外，以将其从播放属性中删除，该div内的所有内容都会明显激活，但这只会在新的浏览器窗口中打开mp3文件：

<div class="wp-playlist-item-length"><span>
        <a href="{{ data.src }}"><i class="fa fa-download" title="download" aria-hidden="true"></i></a>
     </span>{{ data.meta.length_formatted }}</div>
        <# } #>             
    </div>
    <span>
    <a href="{{ data.src }}"><i class="fa fa-download" title="download" aria-hidden="true"></i></a>
    </span>

有没有办法让原来的下载图标为每个mp3打开“保存”对话框？我不是编码员，所以不确定当点击前一个线程中的图标时是否会发生这种情况，因为没有工作示例？

我非常感谢另一个线程，因为它几乎就在那里，但只需要图标来实际激活。

感谢您的帮助。提前感谢：）

编辑：我在前面发现了这一点，它显然阻止了子事件触发父事件。我已经尝试将其合并到上面的代码中，在顶部，但它不起作用（这并不奇怪，因为我真的不理解代码），但是，这仍然不会给我一个“另存为”对话框，但会阻止下载按钮播放该剪辑。

$("#parentEle").click( function(e) {
alert(\'parent ele clicked\');
});
$("#parentEle").children().click( function(e) {
//this prevent the event from bubbling to any event higher than the direct children
e.stopPropagation();
});

<script type="text/html" id="tmpl-wp-playlist-current-item">
    <# if ( data.image ) { #>
    <img src="{{ data.thumb.src }}"/>
    <# } #>
    <div class="wp-playlist-caption">
            <span class="wp-playlist-item-meta wp-playlist-item-title">{{ data.title }}</span>
            <# if ( data.meta.album ) { #><span class="wp-playlist-item-meta wp-playlist-item-album">{{ data.meta.album }}</span><# } #>
            <# if ( data.meta.artist ) { #><span class="wp-playlist-item-meta wp-playlist-item-artist">{{ data.meta.artist }}</span><# } #>
    </div>

</script>
<script type="text/html" id="tmpl-wp-playlist-item">
    <div class="wp-playlist-item">
            <a class="wp-playlist-caption" href="{{ data.src }}">
                    {{ data.index ? ( data.index + \'. \' ) : \'\' }}
                    <# if ( data.caption ) { #>
                            {{ data.caption }}
                    <# } else { #>
                            <span class="wp-playlist-item-title">{{{ data.title }}}</span>
                            <# if ( data.artists && data.meta.artist ) { #>
                            <span class="wp-playlist-item-artist"> — {{ data.meta.artist }}</span>
                            <# } #>
                    <# } #>
            </a>
            <# if ( data.meta.length_formatted ) { #>
            <div class="wp-playlist-item-length">{{ data.meta.length_formatted }}</div>
            <# } #>             
    </div>

    <!-- BEGIN CHANGES -->
       <a href="{{ data.src }}" class="wpse-download" download=""><i class="fa fa-download" title="Download" aria-hidden="true"></i></a>
    <!-- END CHANGES -->
    </script>

/*playlist title - more to right*/
.wp-playlist-item-title {
    padding-left:25px
}

/*download link styles - move within playlist & to left of playlist title*/

.wpse-download {
    margin-top: -22px;
    padding-left:5px;
    position: absolute;
}

/*change color of icon*/
.wpse-download {
 color:white!important;
}

/*change hover / active state of download icon*/
.wpse-download:hover, .wpse-download:visited
{
 color:#aaa!important;
}