这是我的简单html页面。在这个程序中，当我按enter键创建动态行时，它会创建一个新行。但问题是我想更改每一行的id，比如--search1，search2，search3。
为了检查这个，我在alert中显示id，但是在alert框中只显示第一行id，但是当我检查页面并检查第二行id时，它改变了id。那么我能做什么呢？
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" href="Bootstrap/bootstrap.css" rel="stylesheet"/>
<title>JSP Page</title>
</head>
<body>
<br><br>
<center>
<div class="container-fluid">
<div class="row">
<div class="col-lg-8">
<div class="table-responsive">
<table class="table-responsive table-bordered">
<thead>
<tr>
<th>No.</th>
<th>Name</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">1</td>
<td><input type="text" class="inputs searchName" name="pname_1" size="15" id="search1"/></td>
<td><input type="text" class="inputs lst" size="15" /></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</center>
<script type="text/javascript" src="Bootstrap/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="Bootstrap/bootstrap.js"></script>这是用于创建动态行的jquery
$(document).keypress(
function(event){
if (event.which == '13') {
event.preventDefault();
}
});
var i = $('table tr').length;
var count=0;
$(document).on('keyup', '.lst', function(e)
{
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 13)
{
count = $('table tr').length;
html = '<tr>';
html += '<td align="center">'+ i +'</td>';
html += '<td><input type="text" class="inputs searchName" size="15" name="pname_' + i + '" id="search'+i+'" /></td>';
html += '<td><input type="text" class="inputs lst" size="15" /></td>';
html += '</tr>';
$('table').append(html);
$(this).focus().select();
i++;
}
});
$(document).on('keydown', '.inputs', function(e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code==13) {
var index = $('.inputs').index(this) + 1;
$('.inputs').eq(index).focus();
}
});
$('.searchName').keyup(function()
{
var id=$(this).attr("id");
alert(id);
});
3条答案
按热度按时间unftdfkk1#
我认为您应该学习jquery是如何工作的。都是关于选择器的。应用于的选择器
id选择零或一个元素。应用于类的选择器选择更多的元素。您应该阅读常见问题解答：如何使用类或id选择项目？。读完这篇文章后，我想到了你的代码有什么问题。
o4tp2gmn2#
我认为您需要使用$（document）.on而不是$（'.searchname'）.keyup函数
请尝试以下代码
下面是工作的jsfiddle：https://jsfiddle.net/r9hpyabh/
js81xvg63#
不得不修改你的一些代码，发现了很多错误，但我想我已经把你摆平了。
首先你需要定义你的html变量，所以我添加了
var html;你的第二个htmlvar复制了您以前的html，所以您需要用每个新的html将其清空$(document).on('keyup', '.lst', function(e) {所以我补充说html = '';第三，你需要改变你的想法$('.searchName').keyup(function() {至$(document).on('keyup', '.searchName', function() {来解释你的动态内容。记住，无论何时处理动态内容，都需要使用
$(document).on('event', 'class or id', function() {能够捕获动态内容。