Question

所以我创建了一个简单的JQuery程序，它将表单元素放在表中并创建一个select项，并在每次添加新行时为行数添加一个选项：

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        var i=1;
        $("#kopche").click(function(){
            var name=$("#name");
            var index=$("#indeks");
            var grade=$("#grade");

            alert("Grade");

            var body=$("#body");
            body.append("<tr><td>"+name.val()+"</td><td>"+index.val()+"</td><td>"+grade.val()+"</td></tr>");

            name.val("");
            index.val("");
            grade.val("5");
            if(i==1)
            {
                $("table").after('<br/><br/><select id="brojka"></select>');
                var br=$("#brojka");
            }
            br.append('<option>'+i+'</option>');

            i=i+1;

            alert("Okey");
        });
    });
</script>
</head>
<body>
Name: <input type="text" id="name"/><br/><br/>
Index: <input type="text" id="indeks"/><br/><br/>
Grade: <select id="grade">
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>9</option>
    <option>10</option>
</select> <br/><br/>

<button id="kopche">Add</button>
<br/><br/>

<table border="1">
<thead>
<tr>
    <td>Name</td> <td>Index</td> <td>Grade</td>
</tr>
</thead>
<tbody id="body">

</tbody>
</table>

</body>
</html>

然而，该计划并未运作良好。在行i = i + 1时似乎存在问题。

有什么想法吗？

Answer 1

如果br不是1，则您没有设置i变量。

这是修复。

$(document).ready(function(){
        var i=1;
        $("#kopche").click(function(){
            var name=$("#name");
            var index=$("#indeks");
            var grade=$("#grade");

            alert("Grade");

            var body=$("#body");
            body.append("<tr><td>"+name.val()+"</td><td>"+index.val()+"</td><td>"+grade.val()+"</td></tr>");

            name.val("");
            index.val("");
            grade.val("5");
            if(i==1)
            {
                $("table").after('<br/><br/><select id="brojka"></select>');
            }
            var br=$("#brojka");
            br.append('<option>'+i+'</option>');

            i=i+1;

            alert("Okey");
        });
    });

希望这有帮助。

更改我打破代码

1 个答案: