如何在文本框中生成用户给定值的索引

How to generate Index of user given value in textbox?

本文关键字：用户 索引 文本      更新时间：2023-09-26

如何设置索引到用户给定的值在文本框及其附加到下表在新创建的行，但如何显示索引在每一行第一列在我的表?我是第一次使用这种功能。

$(document).ready(function(){
  
$('#addbtn').click(function(){
 
  var s = $.trim($('#user').val());
  var i = 0;
  var c = 1;
  var count = i+c;
if(s !=''){
  $('#result').attr('src','http://www.clipartbest.com/cliparts/abT/y4b/abTy4bcL7.png');
$('#usertbl').append('<tr height='"30'">'+'<td>'+count+'</td>'+'<td>'+s+'</td>'+'<td>'+'</td>'+'</tr>');
}
$('#user').val(' ');
  
});
  
});
table,tr,th,td{
border:1px solid #dddddd;
border-collapse:collapse;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="user"/>
<button id="addbtn">Add</button><span><img src="http://pix.iemoji.com/images/emoji/apple/ios-9/256/cross-mark.png" id="result" height="50" width="50"/></span>
<table style="width:100%;" id="usertbl">
<tr height="30">
<th width="34%">Serial Number</th>
<th width="33%">User NAme</th>
<th width="33%">Content</th>
</tr>
</table>

$(document).ready(function(){
	var count = 1;
	
	$('#addbtn').click(function(){
		var s = $.trim($('#user').val());
		if(s !=''){
			$('#result').attr('src','http://www.clipartbest.com/cliparts/abT/y4b/abTy4bcL7.png');
			$('#usertbl').append('<tr height='"30'">'+'<td>'+count+'</td>'+'<td>'+s+'</td>'+'<td>'+'</td>'+'</tr>');
			count++;
		}
		$('#user').val(' ');
	});
	$('#user').keyup(function(){
		$('#result').attr('src','http://pix.iemoji.com/images/emoji/apple/ios-9/256/cross-mark.png');
	});
});
table,tr,th,td{
	border:1px solid #dddddd;
	border-collapse:collapse;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="user"/>
<button id="addbtn">Add</button><span><img src="http://pix.iemoji.com/images/emoji/apple/ios-9/256/cross-mark.png" id="result" height="50" width="50"/></span>
<table style="width:100%;" id="usertbl">
	<tr height="30">
		<th width="34%">Serial Number</th>
		<th width="33%">User NAme</th>
		<th width="33%">Content</th>
	</tr>
</table>

在单击事件之外声明变量，并在单击时使用增量覆盖它。

声明I上面的点击功能。

ie - i = 0;

您可以计算行数并将其用于索引

var $tbl = $('#usertbl');
var count = $('tr', $tbl).length;

示例:https://jsfiddle.net/wbhuccd7/

相关文章：