使用select标签时出现一个问题,当我选择第一个选项后,对应的table不显示,当我再次选择下拉选框才显示

代码如下,不明白为什么需要再次点击才会出现对应的table,怎么样才可以只选择一个select就可以实时显示对应table

<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>盘点单查询</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/default.css" />
</head>
<body>
    <div class="TAB">
        <div id="n1Tab" class="n1Tab">

            <select style="width: 250px;height: 50px;margin-left: 1%;margin-top: 30px;border-radius: 10px;" id="select"
                onclick="showData(value)">
                <option id="n1Tab_Title0" value="n1Tab_Title0">未过账的账单</option>
                <option id="n1Tab_Title1" value="n1Tab_Title1">已过账的账单</option>
                <option id="all" value="all">全部账单</option>
            </select>
         
            <div class="TabContent p2m">
                <div class="n1Tabc" id="n1Tab_Content0" style="display:block;">
                    <div class="form">
                        <div class="Result">
                            <table width="98.6%" border="1" cellpadding="0" cellspacing="0" bordercolor="#cccccc"
                                class="ListTab3" id="n1Tab_Table0">
                                <thead style="margin-right: 1%;background-color: mediumseagreen;">
                                    <tr>
                                        <th id="th1">未过账账单</th>
                                        <th class="em3" id="th2">版本</th>
                                        <th class="em5" id="th3">创建人</th>
                                        <th class="em5" id="th4">创建日期</th>
                                    </tr>
                                </thead>
                                <tbody id="uncompleteTbody">
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="n1Tabc" id="n1Tab_Content1">
                    <div class="form">
                        <div class="Result">
                            <table width="98.6%" border="1" cellpadding="0" cellspacing="0" bordercolor="#cccccc"
                                class="ListTab3" id="n1Tab_Table1">
                                <thead style="margin-right: 1%;background-color: mediumseagreen;">
                                    <tr>
                                        <th id="th5">已过账盘点单</th>
                                        <th class="em3" id="th6">版本</th>
                                        <th class="em5" id="th7">创建人</th>
                                        <th class="em5" id="th8">创建日期</th>
                                    </tr>
                                </thead>
                                <tbody id="mainTable">
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="c"></div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="../../script/barcode_general/Common.js"></script>
<script type="text/javascript">
  var zflag = "";
function showData(value) {
        var n = "";
        displayCount = prePageCount;
        //控制未过账的账单显示,已过账的账单不显示
         if (value == "n1Tab_Title0") {
            $("#n1Tab_Content1").hide();
            $("#n1Tab_Content0").show();
            $("#n1Tab_Title0").addClass("active");
            $("#n1Tab_Title1").removeClass("active");
            zflag = "";
            n = false;

        }
    
         if (value == "n1Tab_Title1") {
            $("#n1Tab_Content0").hide();
            $("#n1Tab_Content1").show();
            $("#n1Tab_Title1").addClass("active");
            $("#n1Tab_Title0").removeClass("active");
            zflag = "X";
            n = true;

        }
        if (value == "all") {
            $("#n1Tab_Content0").show();
            $("#n1Tab_Content1").show();
            $("#n1Tab_Title1").addClass("active");
            $("#n1Tab_Title0").addClass("active");
            zflag = "F";
        }

}

onclick 换成 onchange