1

サウンド ファイルを再生するボタンに問題があります。

2 つのボタンがあり、1 つはサウンド ボタンを有効にするボタンで、もう 1 つはクリックするとサウンドが再生されます。基本的に「有効」なクラスのボタンだけが音を鳴らすのですが、ボタンのクラスを有効にしてクリックしても何も起こりません。

作業例はこちら

コードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
    $(document).ready(function() {
    var audioElement = document.createElement('audio');
    audioElement.setAttribute('src', 'http://cd.textfiles.com/10000soundssongs/WAV/DOORBELL.WAV');

    $('.enabled').click(function() {
    audioElement.play();
});
});
</script>
<script>
  $(document).ready(function() {
  $('#enabler').click(function() {
  $('.disabled').attr('class','enabled');
  $('.enabled').text('Play (enabled)');
});
});
</script>
<style>
.enabled{color:green;}
</style>
</head>
<body>
<button class="disabled">Play</button>
<button id="enabler">Make Play-Button work</button>
</body>
</html>

いつものように、どんな助けも大歓迎です!

4

2 に答える 2

2

問題はclick、セレクターのイベント リスナーを開始するときに、関数をバインドする.enabledクラスの要素が存在しないことです。enabledボタンがクリックされたときに関数が実行されるように、存在する親要素にイベント リスナーをバインドする必要があります。

変更する必要があります

$('.enabled').click(function() {
    audioElement.play();
});

$(document).on('click', '.enabled', function() {
    audioElement.play();
});

これを示すjsbinを次に示します。

于 2013-01-17T21:15:06.830 に答える
0
<button id="enabler">Make Play-Button work</button>

この行にエラーがあり、そのイネーブラーと有効にする必要があります:-)

于 2013-01-17T21:00:31.853 に答える