Question

我有一个使用WooCommerce的网站。每次将商品添加到购物车时，我都想播放一个简短的声音。我已经准备好了mp3文件。

我决定使用此https://github.com/admsev/jquery-play-sound 它可以在PC上运行，但在iOS浏览器上听不到声音。

我的脚本如下

<head>
<style>
header{
    color: #f4f4f4;
    background-image: url("header-background.jpeg");    
}

header img{
    float: left;
    display: inline-block;
}

header h1{
    font-size: 40px; 
    color: #f4f4f4;
    display: inline-block;
    position: relative;
    padding: 20px 20px 0 0;
    display: inline-block;
}
</style></head>


<header>
<a href="index.html">
    <img src="./branding.png" alt="technocrat logo" height="100px" width="100px"></a>
    <a href="index.html">
    <h1><span> Technocrat</span> Blog</h1></a>
</div></header>

我该怎么做才能在iOS浏览器上播放声音？有人可以帮我吗？

Answer 1

首先，我将其从此操作中删除：

add_action( 'wp_enqueue_scripts', 'tap_sound' );

，只需将其硬编码（用于检查）添加到页脚中即可。

第二，我会使用jQuery，它会更清洁。例： https://webdev-il.blogspot.com/2017/10/trigger-audio-and-playing-sounds-with.html

Answer 2

更好地重写脚本以仅使用jQuery，更可靠：）

<script>
jQuery(document).ready(function(){
    jQuery('a').on('click', function(){
        jQuery.playSound("<?php echo get_bloginfo('stylesheet_directory');?>/my_sound.mp3");
    });
});
</script>

如果iOS仍然存在问题，请报告。

将项目添加到iOS浏览器上的购物车时播放声音

2 个答案: