1

我真的是网络开发的新手。

当用户从下拉框中选择任何选项时，我正在尝试创建多个输入框（以便它是动态的）

但是，当我单击时，我只收到用于测试目的的弹出消息，但我没有看到任何输入框。此外，当我检查我的源页面时，我的 HTML 页面在我放置的位置有错误<div>（这是我的输入框应该显示的位置）。我收到的错误消息是在“表”错误中看到的开始标记“div”......我假设程序由于这个错误而无法显示输入框。我试图在谷歌中寻找答案，但我仍然无法解决这个问题......

请让我知道如何解决此错误....

任何帮助将不胜感激......提前致谢！

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <title>Run test Script</title>
        <script type="text/javascript">

        function createInputs() {
        alert('writing inputs'); //Test....this message shows...when i change
        var value = document.getElementById("test").value; // this gives you the selected value.
        var split = value.split;
        var splitsize = split.length;
        var code = '';
        for (var j=0; j<splitsize; j++){
            var a = "<input type = 'text' name = '" + split[j] + "' id = '" + split[j] + "'>";
            code += a;
        }
        document.getElementById("inputBox").innerHTML = code;
   }

        </script>
    <body>
        <form action="./runtest?host=11.111.11.11&envname=XP" method="post" name="testForm">  
        <table border="0">
        <tr style="font-weight: bold; font-size: 16px;">
            <td>Environment Name: </td>
            <td>XP</td>
        </tr> 
        <tr>
            <td>Select user name :</td>
            <td><select id="userName" name="userName">
                <option value="user">user</option>
                <option value="guest">guest</option>
                </select>
            </td>
         </tr>
         <tr>
            <td>Enter Password :</td>
            <td>                               

            <input id="pass" type="password" name="password">

         </tr>
         <tr>
            <td>Select test : </td>
            <td><select id="testname" name="testname" onchange="createInputs()">
                <option value="" name=""></option>
                <option value="size" name="startup">startup</option>

                <option value="size" name="Performance">Performance</option>

                <option value="" name="reboot">reboot</option>

                <option value="size,time" name="fetch event">fetch event</option>
                </select></td>
         </tr>
         <tr>
             <td></td>
             <div id = "inputBox"></div>   //*************Error message here ***********
        </tr>
         <tr>
                <td> Enter test User: </td>
                <td><input type="text" id="tuser"></td>
         </tr>
         <tr>
                <td> Enter Test Date: </td>
                <td><input type="text" id="tdate"></td>
         </tr>
          </table>
          <br>
          <input type="submit" value="Run" name="Run">&nbsp;&nbsp;
          <input type="button" value="Close" onclick="window.close()"> &nbsp;&nbsp;
          </form>
    </body>
</html>
4

4 回答 4

2

解决此问题的最快方法是在执行此代码时打开谷歌浏览器并查看开发者工具和控制台。

问题一：document.getElementById("compname")为null，需要改成document.getElementById("testname")。

var value = document.getElementById("testname").value;

问题2：split是一个方法，需要传入一个分隔符。所以，不是 value.split，而是 value.split(",")

var split = value.split(",");

请注意，您的重新启动选项可能无法正常工作，因为您的值为空。

编辑：正如其他人所指出的，您还应该在http://validator.w3.org/#validate_by_input验证您的 HTML

于 2012-11-27T15:05:35.143 回答
1

所以问题是你不能将一个div元素直接嵌套在一个tr元素内。事实上，我很确定您可以“正式”用作元素的直接子元素的唯一元素tr是<th>和<td>

尝试div用td元素包装元素......

<tr>
    <td></td>
    <td>
        <div id = "inputBox"></div>
    </td>
</tr>

如果您尝试动态创建此input元素，那么您的 javascript 可能存在问题。您是否收到任何控制台输出错误？

此外，如果要捕获用户输入，请使用标签...

<tr>
    <td></td>
    <td>
        <input id="inputBox" type="text" />
    </td>
</tr>
于 2012-11-27T14:53:34.040 回答
1 
<tr>
   <td></td>
   <td>
   <div id = "inputBox"></div>   //*************Error message here ***********
   </td>
</tr>

您需要在<td></td>标签中添加您的 div。

于 2012-11-27T14:54:47.873 回答
1

你的脚本执行

document.getElementById("compname")

..但我看不到带有 id 的元素compname。我看到一个带有testname.

于 2012-11-27T14:56:32.830 回答