我如何使用html中的jQuery正确显示下拉菜单

问题描述 投票:1回答:1

嗨,我是jQuery的新手,我正在尝试将其实现为HTML代码,但是它不起作用

它在这里工作https://jsfiddle.net/6trb0whz/

但是在这里不起作用有人可以帮我解决这个问题吗

<!DOCTYPE html>
<html>
<head>

</head>
<body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script>

    var options = $("#DropDownList2").html();
$('#DropDownList2 :not([value^="App"])').remove();
$('input:radio').change(function(e) {
    var text = $(this).val();
    $("#DropDownList2").html(options);
    $('#DropDownList2 :not([value^="' + text.substr(0, 3) + '"])').remove();
});

    </script>
    <!--
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script>
var options = $("#DropDownList2").html();
$('#DropDownList2 :not([value^="App"])').remove();
$('input:radio').change(function(e) {
    var text = $(this).val();
    $("#DropDownList2").html(options);
    $('#DropDownList2 :not([value^="' + text.substr(0, 3) + '"])').remove();
});
</script>
   <input type="radio" name="test" value="Orange" /> Burger Garage
   <input type="radio" name="test" value="Burger" /> Hardee's
    <input type="radio" name="test" checked="checked" value="Apple" /> Burger Factory & More
    <br />
    <select ID="DropDownList2" Height="18px" Width="187px">
        <option Value="Apple_Style_1">Turbo Chicken</option>
        <option Value="Apple_Style_2">Twin Turbo Chicken</option>
        <option Value="Apple_Style_3">Garage Burger</option>
        <option Value="Burger_Style_1">Chicken Fille</option>
        <option Value="Burger_Style_2">Grilled Chicken Fillet</option>
        <option Value="Burger_Style_3">Jalapeno Chicken</option>
        <option Value="Orange_Style_1">Original Burger</option>
        <option Value="Orange_Style_2">Twin Turbo Chicken</option>
        <option Value="Orange_Style_3">Shuwa Burger</option>
    </select>


</body>
</html>
javascript jquery html
1个回答
0
投票

一个问题可能是您没有在<script>之后和</select>之前结束<body>标签。

要关闭<script>标签,请使用</script>

另一个问题可能是您忘记删除<! - -(在两个中间脚本之间)。

也可以是结尾处的<br />标签!

希望这解决了您的问题!

© www.soinside.com 2019 - 2024. All rights reserved.