在.html中为javascript使用select id_Javascript_Html_Select

在.html中为javascript使用select id

javascript html select

在.html中为javascript使用select id,javascript,html,select,Javascript,Html,Select,您好，下面是代码的工作原理：下拉淹没选择/选项（tan）填充分配的第二个选项（yep、nope、action）第二个选项（yep）被选中，没有指定的功能选择第二个选项（nope）问题：我想在.html中使用selectid=“m”，但它无法识别，也不会显示警报（“tada！！”）选择第二个选项（操作）时，会显示一条警告消息，该消息为11 对于这一行，我想输入，但它只识别（#size）请帮助我。提前谢谢 <html> <head><title>

您好，下面是代码的工作原理：

下拉淹没选择/选项（tan）填充分配的第二个选项（yep、nope、action）

第二个选项（yep）被选中，没有指定的功能
选择第二个选项（nope）

问题：我想在

.html

中使用select

id=“m”

，但它无法识别，也不会显示

警报（“tada！！”）

选择第二个选项（操作）时，会显示一条警告消息，该消息为11

对于这一行，我想输入

，但它只识别（

#size

）

请帮助我。提前谢谢

<html>
<head><title>wahaha</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script>

$(document).ready(function(){
    $("#type").on("change",function(){
    // #type Select is selected

    var val = $(this).val();

    if(val == "tan")
    {
       $("#size").html("<select id='m'><option value='yep'>yep</option><option value='nope'>nope</option><option value='action'>action</option></select>");
    }
    else if(val == "-- select one --")
    {
       $("#size").html("<option value='test'>disney</option><option value='test2'>disneyt</option>");
    }
    else if(val == "green")
    {   
    $("#size").html("<option value='test'>olive</option><option value='test2'>mantis green</option><option value='test2'>jungle green</option><option value='test'>asparagus</option>");
    }   
    else if(val == "blue")
    { 
    $("#size").html("<option value='test'>azure</option><option value='test2'>cerulean</option>");
    }
    });

    $("#size").change(function(){
    // #size Select is selected

    var val2 = $(this).val();

    if(val2 == "action")
    {   
        alert( 5  + 6 );
    }
    else if(val2 == "test")
    {
        alert("sample code");
    }
    });

    $("#m").change(function(){
    var val3 = $(this).val();
    if(val3 == "action")
    {   
        alert( 5  + 6 );
    }
    else if(val3 == "nope")
    {
        alert("tada!!");
    }
    });

});
</script>
</head>
<body>
<form>

<select id="type">
        <option value="-- select one --">-- select one -- </option>
        <option value="tan">tan</option>
        <option value="green">green</option>
        <option value="blue">blue</option>

</select>
<select id="size">
    <option value="">-SIZE -- </option>
    <option value="">size </option>
    </select>
<br><br>
</form>
</body>
</html>


娃哈哈
$（文档）.ready（函数（）{
$（“#type”）。在（“change”，function（）上{
//#已选择类型选择
var val=$（this.val（）；
如果（val=“tan”）
{
$（“#size”）.html（“yepnopeaction”）；
}
否则，如果（val==“--选择一个--”）
{
$（“#size”）.html（“迪士尼乐园”）；
}
否则如果（val==“绿色”）
{   
$（“#size”）.html（“绿螳螂绿丛林绿芦笋”）；
}   
否则如果（val==“蓝色”）
{ 
$（“#size”）.html（“azurecerulean”）；
}
});
$（“#大小”）.change（函数（）{
//#选择大小
var val2=$（this.val（）；
如果（val2==“动作”）
{   
警戒（5+6）；
}
否则如果（val2==“测试”）
{
警报（“样本代码”）；
}
});
$（“#m”）.更改（函数（）{
var val3=$（this.val（）；
如果（val3==“动作”）
{   
警戒（5+6）；
}
else if（val3==“no”）
{
警惕（“tada！！”）；
}
});
});
--选择一个--
棕褐色的
绿色
蓝色
-大小--
大小

在这里，我将警报功能移动到侦听器，当

#size

更改时会触发该功能

问题出在哪里

下面的代码行没有将第二个下拉列表的id替换为

。只有其中的值在更改

$("#size").html("<select id='m'><option value='yep'>yep</option><option value='nope'>nope</option><option value='action'>action</option></select>");

$（“#size”）.html（“yepnopeaction”）；

固定代码


娃哈哈
$（文档）.ready（函数（）{
$（“#type”）。在（“change”，function（）上{
//#已选择类型选择
var val=$（this.val（）；
如果（val=“tan”）
{
$（“#size”）.html（“yepnopeaction”）；
}
否则，如果（val==“--选择一个--”）
{
$（“#size”）.html（“迪士尼乐园”）；
}
否则如果（val==“绿色”）
{   
$（“#size”）.html（“绿螳螂绿丛林绿芦笋”）；
}	
否则如果（val==“蓝色”）
{ 
$（“#size”）.html（“azurecerulean”）；
}
});
$（“#大小”）.change（函数（）{
//#选择大小
var val2=$（this.val（）；
如果（val2==“动作”）
{	
警戒（5+6）；
}
否则如果（val2==“测试”）
{
警报（“样本代码”）；
}
else if（val2==“nope”）
{
警惕（“tada！！”）；
}
});
$（“#m”）.更改（函数（）{
var val3=$（this.val（）；
如果（val3==“动作”）
{	
警戒（5+6）；
}
});
});
--选择一个--
棕褐色的
绿色
蓝色
-大小--
大小

我没有看到任何id为“m”的东西。这应该是什么？嗨，如果（val==“tan”）@SasukeScend请检查答案。@SatejS嗨，非常感谢！：）你好非常感谢您花时间回答这个问题^_^

<html>
<head><title>wahaha</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script>

$(document).ready(function(){
    $("#type").on("change",function(){
    // #type Select is selected

    var val = $(this).val();

    if(val == "tan")
    {
       $("#size").html("<select id='m'><option value='yep'>yep</option><option value='nope'>nope</option><option value='action'>action</option></select>");
    }
    else if(val == "-- select one --")
    {
       $("#size").html("<option value='test'>disney</option><option value='test2'>disneyt</option>");
    }
    else if(val == "green")
    {   
    $("#size").html("<option value='test'>olive</option><option value='test2'>mantis green</option><option value='test2'>jungle green</option><option value='test'>asparagus</option>");
    }   
    else if(val == "blue")
    { 
    $("#size").html("<option value='test'>azure</option><option value='test2'>cerulean</option>");
    }
    });

    $("#size").change(function(){
    // #size Select is selected

    var val2 = $(this).val();

    if(val2 == "action")
    {   
        alert( 5  + 6 );
    }
    else if(val2 == "test")
    {
        alert("sample code");
    }
    });

    $("#m").change(function(){
    var val3 = $(this).val();
    if(val3 == "action")
    {   
        alert( 5  + 6 );
    }
    else if(val3 == "nope")
    {
        alert("tada!!");
    }
    });

});
</script>
</head>
<body>
<form>

<select id="type">
        <option value="-- select one --">-- select one -- </option>
        <option value="tan">tan</option>
        <option value="green">green</option>
        <option value="blue">blue</option>

</select>
<select id="size">
    <option value="">-SIZE -- </option>
    <option value="">size </option>
    </select>
<br><br>
</form>
</body>
</html>

$("#size").html("<select id='m'><option value='yep'>yep</option><option value='nope'>nope</option><option value='action'>action</option></select>");