Javascript函数无法在jsp文件中运行

时间:2016-04-11 23:18:40

标签: javascript html jsp

我有一个没有运行我的javascript函数的jsp文件。它在html文件中有效。这是用于创建它的html和javascript。当单击单选按钮时,javascript会切换表单各部分的可见性。

<script language="Javascript">
     //How many Questions
     function CTDefault(){
       document.getElementById("CTDefault").style.visibility="visible";
       document.getElementById("CTManual").style.visibility="hidden";
       document.getElementById("CTFile").style.visibility="hidden";
     }
     //Manual
     function CTManual(){
        document.getElementById("CTDefault").style.visibility="hidden";
        document.getElementById("CTManual").style.visibility="visible";
        document.getElementById("CTFile").style.visibility="hidden";  
     }
     //Load Data from Form
     function CTFile(){
        document.getElementById("CTDefault").style.visibility="hidden";
        document.getElementById("CTManual").style.visibility="hidden";
        document.getElementById("CTFile").style.visibility="visible";   
     }
</script>
<!--Buttons-->
<div id="enterDataToggle" class="btn-group" data-toggle="buttons" >
<!--Default-->
<label class="btn btn-default active" id="checkin-label">
     <input type="radio" onClick="CTDefault()" checked> Default
</label>

<!--Input Data Manually-->
<label class="btn btn-default active" id="checkin-label">
     <input type="radio" checked onClick="CTManual()">
     Input Data Manually
</label>

<!--Load Data from File-->
<label class="btn btn-default active" id="checkin-label"
    <input type="radio" value="checking" onClick="CTFile()">
                    Load Data from File
</label>

</div>

<!-- CT Input Data Default--> 
<div style= "visibility:hidden; position:absolute" id="CTDefault">
    <h4>Default-If you don't have this data, we have data for you. You do not have to do anything else. If you have data please click input data manually or load data from file.</h4>
</div>

<!--CT Manually-->
<div style=" position:absolute" id="CTManual">
    <table class="table table-bordered table-striped">
        <thead>
            <tr>
                <th>Mean</th>
                <th>Standard Deviation</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th>
                    <input name="CTMean" type="text" style="width:100%" required>
                </th>
                <th>
                    <input name="CTStd" type="text" style="width:100%" required>
                </th>
            </tr>
        </tbody>
    </table>
</div>

任何帮助表示赞赏! :)

1 个答案:

答案 0 :(得分:0)

也许如果你在html标签之后声明你的脚本:

<!--Buttons-->
<div id="enterDataToggle" class="btn-group" data-toggle="buttons" >
<!--Default-->
<label class="btn btn-default active" id="checkin-label">
     <input type="radio" name="option" onClick="CTDefault()" checked> Default
</label>

<!--Input Data Manually-->
<label class="btn btn-default active" id="checkin-label">
     <input type="radio" name="option" checked onClick="CTManual()">
     Input Data Manually
</label>

<!--Load Data from File-->
<label class="btn btn-default active" id="checkin-label">
    <input type="radio" name="option" value="checking" onClick="CTFile()">
                    Load Data from File
</label>

</div>

<!-- CT Input Data Default--> 
<div style= "visibility:hidden; position:absolute" id="CTDefault">
    <h4>Default-If you don't have this data, we have data for you. You do not have to do anything else. If you have data please click input data manually or load data from file.</h4>
</div>

<!-- CT Input Data Default--> 
<div style= "visibility:hidden; position:absolute" id="CTFile">
    <h4>CTFile.</h4>
</div>

<!--CT Manually-->
<div style=" position:absolute" id="CTManual">
    <table class="table table-bordered table-striped">
        <thead>
            <tr>
                <th>Mean</th>
                <th>Standard Deviation</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th>
                    <input name="CTMean" type="text" style="width:100%" required>
                </th>
                <th>
                    <input name="CTStd" type="text" style="width:100%" required>
                </th>
            </tr>
        </tbody>
    </table>
</div>
<script language="Javascript">
     //How many Questions
     function CTDefault(){
       document.getElementById("CTDefault").style.visibility="visible";
       document.getElementById("CTManual").style.visibility="hidden";
       document.getElementById("CTFile").style.visibility="hidden";
     }
     //Manual
     function CTManual(){
        document.getElementById("CTDefault").style.visibility="hidden";
        document.getElementById("CTManual").style.visibility="visible";
        document.getElementById("CTFile").style.visibility="hidden";  
     }
     //Load Data from Form
     function CTFile(){
        document.getElementById("CTDefault").style.visibility="hidden";
        document.getElementById("CTManual").style.visibility="hidden";
        document.getElementById("CTFile").style.visibility="visible";   
     }
</script>

你的掠夺者:https://plnkr.co/edit/m0f9XPdA4t85mYJpizl4?p=preview

PS:

  • 一个标签标签未正确关闭
  • 在您的示例
  • 中存在ID为CTFile的元素
  • 您应该使用唯一名称命名您的单选按钮