1

我正在尝试在 javascript 中做一个简单的 if 语句。该脚本将根据在 adiv中选择的选项确定 a 的可见性select。

如果我选择任何选项，它就像我选择了“自定义”并显示div. 但是，如果我随后选择“本月”或“上个月”，它将不会返回到display="none". 有趣的是，文本框“fromDate”和“toDate”的值会发生变化，就好像 if 语句正确触发一样。我想不通他们为什么不回来style.display="none"。

<body>
<form name="input" action="mlic_DORReport.cfm?dlFile=1" method="post" style="text-align:center;">
    <table align="center">
    <tr>
        <td>
            <h1>Electronic NOS File Generator</h1>
            <hr/>
        </td>
    </tr>
    <tr>
        <td>
            <table cellpadding="0" cellspacing="0" width="99%">
            <tr>
                <td>
                    <cfoutput>
                    <input type="hidden" name="pastFromMonth" id="pastFromMonth" value="#pastFromMonthOp#"/>
                    <input type="hidden" name="pastEndMonth" id="pastEndMonth" value="#pastEndMonthOp#"/>
                    <input type="hidden" name="thisFromMonth" id="thisFromMonth" value="#thisFromMonthOp#"/>
                    <input type="hidden" name="thisEndMonth" id="thisEndMonth" value="#thisEndMonthOp#"/>
                    </cfoutput>
                    <div id="customHeader" style="display:none">
                        <table align="center">
                        <tr>
                            <td align="center" style="font-weight:bold;">
                                 Enter dates in "YYYY-MM-DD HH:MM:SS" format
                            </td>
                        </tr>
                        </table>
                    </div>
                    <table align="center" cellpadding="1" cellspacing="1" width="65%">
                    <tr>
                        <td align="center">
                            <b>Date Range: </b>
                            <select name="frombox" id="fromBox" onchange="selectDateRange()">
                                <option value="Past Month">Past Month</option>
                                <option value="This Month">This Month</option>
                                <option value="Custom">Custom</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div id="customTxtBox" style="display:none">
                                <cfoutput>
                                <table align="center">
                                <tr>
                                    <td align="right">
                                         From:
                                    </td>
                                    <td>
                                        <input type="text" name="fromDate" id="fromDate" mask="YYYY-MM-DD" value="#pastFromMonthOp#"/>
                                    </td>
                                </tr>
                                <tr>
                                    <td align="right">
                                         To:
                                    </td>
                                    <td>
                                        <input type="text" name="toDate" id="toDate" mask="YYYY-MM-DD" value="#pastEndMonthOp#"/>
                                    </td>
                                </tr>
                                </table>
                                </cfoutput>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td align="center">
                            <b>DMV #: </b>
                            <select name="txtDmvNumber"/>
                                <option value="D1111">D1111</option>
                                <option value="D2222">D2222</option>
                                <option value="D3333">D3333</option>
                                <option value="D4444">D4444</option>
                                <option value="D5555">D5555</option>
                            </select>
                        </td>
                    </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                     &nbsp
                </td>
            </tr>
            <tr>
                <td align="center">
                    <input type="submit" value="Submit"/>
                </td>
            </tr>
            <tr>
                <td>
                    <div id="customFooter" style="display:none">
                        <table align="center">
                        <tr>
                            <td align="center">
                                 (Note: The HH:MM:SS section of the "From:" date should be
                            </td>
                        </tr>
                        <tr>
                            <td align="center">
                                 entered 00:00:00 and the "To:" date should be entered 23:59:59)
                            </td>
                        </tr>
                        </table>
                    </div>
                </td>
            </tr>
            </table>
        </td>
    </tr>
    </table>
</form>

JS

function selectDateRange() {
    var fromboxOption = document.getElementById("fromBox").options[document.getElementById("fromBox").selectedIndex].text;

    if (fromboxOption == "Past Month") {
        document.getElementById("fromDate").value = document.getElementById("pastFromMonth").value;
        document.getElementById("toDate").value = document.getElementById("pastEndMonth").value;

        document.getElementById("customHeader").style.display = "none";
        document.getElementById("customTxtBox").style.display = "none";
        document.getElementById("customFooter").style.display = "none";
    }
    else if (fromboxOption == "This Month") {
        document.getElementById("fromDate").value = document.getElementById("thisFromMonth").value;
        document.getElementById("toDate").value = document.getElementById("thisEndMonth").value;

        document.getElementById("customHeader").style.display = "none";
        document.getElementById("customTxtBox").style.display = "none";
        document.getElementById("customFooter").style.display = "none";
    }
    else(fromboxOption == "Custom") {
        document.getElementById("customHeader").style.display = "inline";
        document.getElementById("customTxtBox").style.display = "inline";
        document.getElementById("customFooter").style.display = "inline";
    }
}
    </body>
4

1 回答 1

3

在您的if语句的最后一个条件中，您包含了一个没有“if”的表达式。改变它从

else (fromboxOption == "Custom")

至

else if (fromboxOption == "Custom")
于 2013-07-03T21:24:27.017 回答