通过JQuery更改id可见性

Question

这是我的HTML

<select name="change" id="games">
<option value="game1">Tennis Championship</option>
<option value="game2">The Champions 3D</option>
<option value="game3">Pool Championship</option>
</select>

<div id="game1" style="display:none">...

我的剧本

$("#games").change(function(){
$("#game1").show();});

这不起作用:(为什么？

Answer 1

$(document).ready(function(){
    $("select#games").change(function(){
        $("#game1").show();
        //or get an alert to see is the select working well or not:
        alert($("select#games").val());
    });
});

Answer 2

您的代码可以使用，您也可以减少代码

＆＃13;

＆＃13;

$("#games").change(function () {
    var a = $(this).val();
    $("div[id^='game']").hide();
    $('#' + a).show();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="change" id="games">
    <option value="game1">Tennis Championship</option>
    <option value="game2">The Champions 3D</option>
    <option value="game3">Pool Championship</option>
</select>
<div id="game1" style="display:none">game1</div>
<div id="game2" style="display:none">game2</div>
<div id="game3" style="display:none">game3</div>

＆＃13;

＆＃13;

＆＃13;