Question

我需要创建jQuery拖放。当我放下项目应该发出声音，剂量任何人都知道该怎么做？我知道我们可以使用CSS和jQuery的HTML5音频标签来实现它，但我需要一个示例代码才能修改它。

$（function（）{ $（“＃dragable”）。draggable（）;

//在我的可放置

中需要声音

    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
        }
    });
});

//我的代码

   $("div#gameboard div").droppable({


        drop: function (event, ui) {
            {

                sendMessage("m " + this.id + " " +
                                 localToGlobal(imgID) + " " +
                                 $(ui.helper).css("left") + " " +
                                 $(ui.helper).css("top")

                            );


            }

           myAudio.src = 'audio/song.mp3';
        }
    });

Answer 1

我可能不是完全正确，但这里有一些可以帮助你的事情：

var myAudio = document.createElement('audio');
myAudio.controls = true;
myAudio.src = 'Your File';
myAudio.play();

为了让它在你放弃时有效，你可以在之前创建音频标签，然后在每一滴都点击播放（）。

我会在ready函数中初始化音频标记：

$(document).ready(function() {

}

然后使用您的代码：

$( "#droppable" ).droppable({
    drop: function( event, ui ) {
        $( this )
            .addClass( "ui-state-highlight" )
            .find( "p" )
                .html( "Dropped!" );

        myAudio.play();
    }
});

}）;

Answer 2

我必须将代码放在$（document）.ready（function（）之外，以使其在我的应用程序中运行：

    <script>
var myAudio = document.createElement('audio');
myAudio.controls = true;
myAudio.src = 'audio/beep.mp3';
myAudio.src = 'audio/beep.wav';
//myAudio.play();
</script>

然后你只需触发myAudio.play（）;在你的drop中：功能代码。

如何用声音效果开发jQuery拖放？

2 个答案: