2013-03-16 11 views
5

これはフォーラムへの私の最初の投稿です。 英語とタイ語の音声ファイルが多数含まれる英語/タイ語のコースウェブサイトを設定しています。マウスオーバー/ボタンのJavaScript関数を使用して、単一のウェブページの概念証明を行いました http://www.javascriptkit.com/script/script2/soundlink.shtml 一部の改行と一部のインラインjでは、これは問題なく動作しました。jqueryにjavascriptオーディオを移動

$(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オーディオコードを含めてみました。上記のように、これは動作しません。どんな助けでも大歓迎です。

+0

ルック:

$('.rollover').click(function(){ ry402.playclip(); }); 

するのは、見てみましょう://stackoverflow.com/questions/6830445/extending-jquery – Bart

答えて

3

は、私はあなたを右に得るかどうかわからないんだけど、あなたは非常に簡単に与えられたリンクからJavaScriptコードを削除することができます:httpこっちhttp://api.jquery.com/click/

+0

このコードをjq_click.jsに入れて、次のように配置します。 RoyS

+0

これはうまくいきません。私は$(document).ready(function(){}の中にコードを置き、スクリプトをロードするjqueryの下のheadセクションに配置します。ダブルポストを申し訳ありません、私はスタックオーバーフローのフォーラムに慣れていません – RoyS

関連する問題