5

これはフォーラムへの私の最初の投稿です。英語とタイ語の音声ファイルを多数含む英語/タイ語コースのウェブサイトを立ち上げています。マウスオーバー/ボタン javascript 関数http://www.javascriptkit.com/script/script2/soundlink.shtmlを使用して、単一の Web ページの概念実証を行いました 。 いくつかの mod といくつかのインライン js を使用すると、これは問題なく機能しました。

$(document).ready(function() { 
  var html5_audiotypes = { 
  "mp3": "audio/mpeg",
  "ogg": "audio/ogg",
     };      
function createsoundbite(sound) {
  "use strict";
  var html5audio = document.createElement('audio');
  if (html5audio.canPlayType){
   for(var i=0; i<arguments.length; i++) {
     var sourceEl = document.createElement('source');
     sourceEl.setAttribute('src', arguments[i]);
     if (arguments[i].match(/\.(\w+)$/i))
     sourceEl.setAttribute('type', html5_audiotypes[RegExp.$1]);
     html5audio.appendChild(sourceEl);
   }
   html5audio.load();
   html5audio.playclip = function() {
    html5audio.pause();
    html5audio.currentTime=0;
    html5audio.play();
    }
    return html5audio;
    }
    else{
    return {playclip:function(){throw new Error("Your browser doesn't support      HTML5 audio unfortunately")}};
    }
  }   
  var cn402=createsoundbite("audio/cn402.ogg", "audio/cn402.mp3");   
  var ry402=createsoundbite("audio/ry402.ogg", "audio/ry402.mp3");     
  var cn403=createsoundbite("audio/cn403.ogg", "audio/cn403.mp3");      
  var ry403=createsoundbite("audio/ry403.ogg", "audio/ry403.mp3");      
  var cn404=createsoundbite("audio/cn404.ogg", "audio/cn404.mp3");      
  var ry404=createsoundbite("audio/ry404.ogg", "audio/ry404.mp3");     
});

JavaScript コードは、次のような html コード行によって呼び出されます。

    <a href="#current" class= "rollover" onclick="ry402.playclip()"></a>Please don't swim by yourself</span>

この関数とそれに関連する変数を jquery に組み込みたいと考えています。すべての js コードが html から削除されるようにします。最初のステップである、jquery コードを機能させるだけで、私にとっては少し問題があることがわかりました。ドキュメント対応関数にjsオーディオコードを含めてみました。上記のとおりですが、これは機能しません。どんな助けでも大歓迎です。

4

1 に答える 1

3

正しいかどうかわかりませんが、指定されたリンクから JavaScript コードを非常に簡単に削除できます。

$('.rollover').click(function(){

ry402.playclip();

});

見てみましょう: http://api.jquery.com/click/

于 2013-03-16T14:23:09.637 に答える