我有以下代码,并试图获取用户输入的数字,以创建一定数量的行,并在单元格中设置一个计数器,最多可达输入的数字(即,如果用户输入 6,则 6 行将显示为 1其中 -6,顶部 1)我认为 for 循环效果很好,但我不知道哪些变量起作用。任何帮助将不胜感激!
$(document).ready(function() {
$('#nbrTxt').focus();
var index = 1;
$('input[name=nbrTxt]').on('keyup', function(e) {
if (e.which === 13) {
$('table').append('<tr><td></td><td></td></tr>');
$('table tr:last td:first').html($(this).val());
$('table tr:last td:last').html(index);
$(this).focus().select();
index++;
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<title> JQuery Selector</title>
<style type="text/css">
body {
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}
</style>
<script src="jquery-1.11.3.min.js"></script>
<script src="jqueryselector.js"></script>
</head>
<body>
<h1>JQuery Selector</h1>
Enter Number:
<input type="number" name= "nbrTxt" id="nbrTxt" />
<input type="button" value="GO" id="btnGo"/>
<table id="table" width="500" border="1">
<tr>
<td>No. Count</td>
<td>Name</td>
</tr>
</table>
</body>
最佳答案
试试这个。我刚刚将 keyup 事件更改为单击,但它应该可以工作。
$(document).ready(function() {
$('#nbrTxt').focus();
$('#btnGo').on('click', function(e) {
var value = $('#nbrTxt').val();
for (var i = 1; i <= value; i++) {
$('table').append('<tr><td></td><td></td></tr>');
$('table tr:last td:first').html(value);
$('table tr:last td:last').html(i);
}
});
});
关于javascript - 创建带有计数器的表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34700291/