HTML中的基本Javascript函数

喀麦隆56

首先,我在Zend服务器上运行代码。我想做的是有一个select下拉菜单,用户可以在其中选择不同的声音。当他们选择一个时,他们按下Quack按钮,然后播放他们选择的声音。我在哪里有代码

document.getElementById("test").innerHTML = "Quacked";

我需要输入代码来播放音频,但是我不知道如何。另外,我无法弄清检索select下拉列表的当前值所需的代码。我在哪里

var x = document.getElementById("Quack").innerHTML;

我需要替换Quack为所选选项的值。我怎么做?

<br>
Select: 
<select id = "mySelect">
    <option value="Quack">Quack</option>
    <option value="Chirp"><Chirp</option>
</select>

Press: 
<button type="button" onclick="quack()">Quack!~</button>

<p id = "test"></p>

<script>
    function quack(){
        var x = document.getElementById("Quack").innerHTML;
        if(x=="Quack"){
            document.getElementById("test").innerHTML = "Quacked";

        }
        if(x=="Chirp"){
                document.getElementById("test").innerHTML = "Chirped";
        }
    }
</script>
<br>
汉基·潘基

您可以像这样获得下拉列表的选定索引的值

var e = document.getElementById("Quack");
var x = e.options[e.selectedIndex].value;

然后,您可以像

document.getElementById('IDforYourAudioTag').play();   //HTML

一个<audio>标签看起来有点像这样

<audio id="IDforYourAudioTag" src="test.wav" preload="auto"></audio>

好读

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用Javascript函数的HTML中的基本温度转换器

来自分类Dev

极其基本的 javascript/HTML 代码中的错误

来自分类Dev

从 HTML 调用 JavaScript 中的函数

来自分类Dev

在 HTML 中调用 JavaScript 函数?

来自分类Dev

基本的PHP函数结果在html表中

来自分类Dev

难以理解Javascript高阶函数中的基本概念

来自分类Dev

如何构建基本的JavaScript函数

来自分类Dev

真正基本的javascript函数概念

来自分类Dev

在html代码中插入javascript函数

来自分类Dev

从HTML中的select元素调用JavaScript函数

来自分类Dev

在动态创建的html中调用javascript函数

来自分类Dev

在html提交按钮中调用javascript函数

来自分类Dev

找不到HTML中的javascript函数

来自分类Dev

从HTML中的JavaScript模块调用函数

来自分类Dev

html中嵌入了多个Javascript函数

来自分类Dev

在JavaScript函数中获取HTML DOM元素

来自分类Dev

从HTML中的select元素调用JavaScript函数

来自分类Dev

python中函数的基本用法

来自分类Dev

基本Javascript- HTML按钮

来自分类Dev

基本Javascript- HTML按钮

来自分类Dev

Javascript:如何在 html 中调用 javascript 函数

来自分类Dev

我可以在JavaScript中仅调用基本构造函数而不使用原型来模拟继承吗?

来自分类Dev

html 中的基本标签说明

来自分类Dev

函数中的JavaScript函数

来自分类Dev

在JavaScript中的NEXT中组合函数调用和HTML标记

来自分类Dev

如何在html文件中声明的javascript中调用函数

来自分类Dev

JavaScript 中的函数在 html 中不起作用

来自分类Dev

Javascript 中的基本回调

来自分类Dev

javascript函数中的javascript函数