HTML 문서에서 소리 재생을 시도합니다. 버튼을 눌러서

디자인 과정에서 "대화 형 명함"을 만들고 싶습니다. 연주 가능한 버튼이있는 피아노를 만들고 싶습니다. 문제는 내가 시도해도 사운드가 어떤 브라우저에서도 재생되지 않는다는 것입니다. 나는 javascript/jQuery의 버튼 중 하나에 소리를 연결하는 것으로 시작한다. (나는 두 언어 모두에 대해 매우 익숙하다. 그래서 내가 정확히 무엇을하고 있는지를 알 수 없다.)하지만 이제는 소리를 듣고 싶다. 그래서 나는 그것을 html 문서에 포함시켰다. 내가 뭘 잘못HTML 문서에서 소리 재생을 시도합니다. 버튼을 눌러서

<!Doctype html> 
<html> 
<head> <link rel="stylesheet" type="text/css" href="stylesheet.css"/> 
<h1>"Yo Dawg, i heard you like muzic."</h1> 
<p>"hej"</p> 


    </head> 
<body> 
    <div id= "wholething"> 
    <div id= "whitekey1"> 
     <div id= "blackkey2"></div></div> 


    <div id= "whitekey2"> 
     </div> 

    <div id= "whitekey1"> 
     <div id="blackkey3"></div> 
     </div> 

    <div id= "whitekey3"> 
     <div id = "blackkey2"></div> 
     </div> 

     <div id= "whitekey4"> 
     <div id = "blackkey2"></div> 
     </div> 
     <div id= "whitekey1"> 
     <div id = "blackkey2"></div> 
     </div> 

     <div id= "whitekey3"></div> 

     <div id= "whitekey2"> 
     <div id = "blackkey1"></div> 
     </div> 
     <div id= "whitekey4"> 
     <div id = "blackkey1"></div> 
     </div> 
     <div id= "whitekey1"> 
     <div id = "blackkey2"></div> 
     </div> 
    </div> 
<script type= "text/javascript" src= "jquery-1.11.2.js"></script> 
<script type= "text/javascript" src="script.js"></script> 

<span id="dummy"></span> 
<p><a href="#" onclick="playSound('afrique-kissingmylove.wav');">Click here to    hear a bird sing</a></p> 

    <p onmouseover="playSound('afrique-kissingmylove.wav');">Or you can put your mouse over this paragraph to hear the same bird sound.</p> 



</body>

: 여기

코드인가? 흑백 키를 누를 때 어떻게 사운드를 재생합니까? (자바 스크립트/jQuery를 사용하는 것이 좋습니다.)

출처

2015-02-06 padawanMiyagi

'playSound' 기능은 어디에 있습니까? – adeneo

검은 색/흰색 키의 이벤트 처리기는 어디에 있습니까? – qtgye

확인 http://kahimyang.info/kauswagan/code-blogs/1652/how-to-play-a-sound-when-an-element-is-clicked-in-html-page – Outlooker

먼저 playSound 함수를 자바 스크립트를 사용하여 구현해야합니다. 이 같은 것을 할 수있는 :

function playSound(file) 
{ 
    var aud=new Audio(file); 
    aud.play(); 
}

을 또한, 귀하의 HTML에서이 작업을 수행 :

<p onclick="playSound('afrique-kissingmylove.mp3');">Click here to    hear a bird sing</p>

앵커 태그는 필요하지 않습니다. 그리고 당신은 (죄송합니다 귀하의 질문은 매우 명확하지 않다) 피아노를 만들고 싶어 가정, 당신은 모든 div를 위해이 작업을 수행 할 수 있습니다

<div id= "whitekey1" onclick="playSound('whitekey1.mp3');"> 
    <div id = "blackkey2" onclick="playSound('blackkey2.mp3');"></div> 
</div>

당신은 여기에서 피아노 이름의 파일을 다운로드 할 수 있습니다 그들을 따라 재 - 이름 : https://www.freesound.org/people/pinkyfinger/packs/4409/

녹색 라벨이 제대로 작동하는지 확인하십시오. 해피 코딩!

출처

2015-02-06 13:41:03

대단히 감사합니다. 꽤 똑바로 보이지만 내 소리는 여전히 연주되지 않습니다. 노래 파일을 어디에서 저장해야합니까? 그리고 네, 피아노를 만들려고합니다. – padawanMiyagi

html 파일이 들어있는 동일한 디렉토리에 사운드를 저장할 수 있습니다. 당신이 이미지를 위해하는 것처럼. 또는 "foo"라는 폴더에 보관했다면, 다음과 같이하십시오. var aud = new Audio ('foo /'+ file);'. 그리고 **이 방법은 ** MP3 파일 **에서만 작동합니다. https://www.freesound.org/people/pinkyfinger/packs/4409/ 또한 업로드하십시오. . :) 해피 코딩! –

다시 한번 감사드립니다! 나는 내가 충분한 포인트를 얻 자마자 나는 upvote하려고 노력하고있다 :) – padawanMiyagi

HTML 문서에서 소리 재생을 시도합니다. 버튼을 눌러서

답변

관련 문제