質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

3928閲覧

HTMLの<audio>タグのsrcにJavaScriptの変数の値を入れたい

hiroakikoura

総合スコア13

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2018/07/27 07:45

編集2018/07/30 07:22

HTMLで音声再生ができるようなものを作成しています。JavaScriptの変数内の値を音声ファイルのURLとして指定したい

html

1<audio controls style="width: 865px; height: 1000px; position: absolute; left: 1460px; top: -90px"> 2 <source id="saisin_id" src="">

上のHTMLの<audio>のソースに下のJavaScriptの変数saisinidに入っているURLを指定したいのですが URIが正しくありません。メディアを読み込めませんでしたと出ます。srcに何も指定していないからだと思います。audioタグのソースに変数saisinidの値を指定するにはどのようにすれば良いでしょうか?

js

1 success: function(data) { 2 var obj = JSON.parse(data); 3 var goukei = obj.length - 1; 4 var saisinid = ("hoge/"+obj[51].id+"/audio.flac"); 5 var element = document.getElementById("saisin_id"); 6  element.setAttribute("src", saisinid); 7}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/07/27 11:23

「うまく動作しない」「うまくいかない」では何が起きているか伝わりません。「○○のようになるはずなのに××となってしまう」のような形で「ゴール」と「現象(エラーメッセージなども含む)」を明確にしてください。https://teratail.com/help/question-tips#questionTips3-4-1
m.ts10806

2018/07/27 11:24

このJavaScript そもそもですが、もしそのままとしたら文法がおかしいです。インデントも。調整してください。
guest

回答2

0

ベストアンサー

これでtest.mp3がセットされるけど

HTML

1<audio controls style="width: 865px; height: 1000px; position: absolute; left: 1460px; top: -90px"> 2<source id="saisin_id" src="" /> 3</audio> 4<script> 5(function(data) { 6 var saisinid = "test.mp3"; 7 var element = document.getElementById("saisin_id"); 8 element.setAttribute("src", saisinid); 9})(); 10</script>

ちなみに、<source id="saisin_id" src="" />ではsrcが無いので

URI が正しくありません。メディア を読み込めませんでした。

ってエラー吐く(firefox)
読めないsourceって事でsrcを書き換えても有効にならないね

source要素をcreateElementしてappendChildしてあげればその辺はクリアするけど、デフォルトがある場合以外だとsourceで指定してあげる必要がそもそも無い気がする

投稿2018/07/27 19:53

efcode

総合スコア422

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hiroakikoura

2018/07/30 07:23

source要素をcreateElementしてappendChildすればとりあえずの解決は可能でしょうか?
efcode

2018/07/30 19:05

静的なHTMLがあって、audioのメディアファイルを指定したいのであれば、audio自体のsrcを書き換えるのがHTML上の流儀って感じはするけどね。 audioelement.src="test.mp3"; ってするだけだし、audioelementの場合は再生される時点でメディアを読みに行くみたいだから、sourceみたいに読めないメディアの場合に無効化されるようなことも無い。 まずはやってみて自分で確認した方が早いと思うよ。
hiroakikoura

2018/07/31 22:04

解決できました! ありがとうございます!
guest

0

audioタグ内のsourceタグにsrcを指定するのではなく、audioタグ自体にsrcを指定するのはいかがでしょうか?
http://www.htmq.com/html5/audio.shtml

HTML

1<audio controls style="width: 865px; height: 1000px; position: absolute; left: 1460px; top: -90px" id="saisin_id" src="">

JavaScript

1function(data) { 2var saisinid = ("URL"); //saisinidに音声ファイルの場所が入っています 3var element = document.getElementById("saisin_id"); 4element.setAttribute("src", saisinid);

投稿2018/07/27 15:53

編集2018/07/27 15:54
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hiroakikoura

2018/07/30 07:26

srcに手動でURLを指定しないとできないようです。。。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問