Today, I tried to solve a problem: When I click the header of a table, then the table will add a new row, and if I click the added row, the row will alert its row number.
This is very easy problem, but I just express the idea about how to solve a problem that is similar, and the progress.
First step, I finish the addition of a new row functions easily, see the code below:
$(document).ready(function(){
$("#tb1 tr").click(function(){
$("#tb1").append("<tr><td>you click me</td></tr>");
})
$("#tb1 td").each(function(i){
$(this).click(function(){
alert(i);
});
});
});
But the click event does not work. And the reason is clear: when the page finish loading, there is any TB element in the table. So I consider I should add the click event when I create the new row! See the changed code below:
$(document).ready(function(){
$("#tb1 tr").eq(0).click(function(){
$("#tb1").append("<tr><td>you click me</td></tr>");
$("#tb1 td").each(function(i){
$(this).click(function(){
alert($(this).parent().index());
});
});
});
});
Now the click event will be triggered, but when I click the first added row, the same message will be shown several times! So I realized that I made a mistake: when I created a new row, I added a click event for every TB element every time. So I change the script:
$(document).ready(function(){
$("#tb1 tr").eq(0).click(function(){
$("#tb1").append("<tr><td>you click me</td></tr>");
$("#tb1 td").filter(":last").click(function(){
alert($(this).parent().index());
});
})
});
OK, the script works correctly now!
At last, I make a summary about how to solve this kind problem:
1 add new element normally;
2 add the trigger event when you create the new element;
3 just add the trigger event for the element what you created just now.
This is my idea to solve this kind of problem, if you have a better idea, please share it with us. Thank you very much.
分享到:
相关推荐
Polya is one of the most frequently quoted mathematicians, and the following statements from "How to Solve It" make clear why: "My method to overcome a difficulty is to go around it." "Geometry is ...
How to Solve It:A New Aspect of Mathematical Method
How to solve it 清晰英文版
How to solve it Modern Huristics 2nd edition
《如何解题,现代启发法》的英文版,DJVU 格式,可搜索。
How To Solve Physics Problems How To Solve Physics Problems How To Solve Physics Problems
《怎样解题》一书由阎育苏翻译,科学出版社于1982年首次出版,该书深入探讨了解题的艺术与策略,尤其关注教育环境中如何有效地指导学生解决问题。本书的核心理念围绕着“如何帮助学生独立解决问题”,并在教育实践中...
标题 "如何解决Hibernate的N+1问题" 涉及的是一个常见的数据库查询优化问题,主要出现在使用Hibernate等ORM框架时。N+1问题是指在进行一对多或多对多关联查询时,原本期望通过一次SQL查询获取所有数据,但实际执行了...
作者: G. Polya 副标题: A New Aspect of Mathematical Method (Princeton Science Library) ISBN: 9780691119663 页数: 288 定价: USD 16.95 出版社: Princeton University Press 装帧: Paperback ...
Using flow charts and line-by-line analysis of a full-scale P2P file-sharing application, they show you how to solve for typical P2P programming challenges – and create your own sate-of-the-art P2P ...
《101项目管理问题及解决方案》一书由Tom Kendrick撰写,由美国管理协会(American Management Association)出版,旨在为项目管理人员提供实用的建议,帮助他们处理现实世界中的项目挑战。本书聚焦于项目管理领域,...
1. 设定阶段(Set the Stage):在开始之前,需要确定一个需要解决的大问题,并组建一个团队。这个团队应由决策者(Decider)、协调者(Facilitator)以及来自不同领域和职能的成员组成。选择合适的工作时间和空间也...
[方法论]Polya How to Solve It 2004 英文版
grDecOrd - solve the problem about decomposition of the digraph to the sections with mutually accessed vertexes (strongly connected components); grDistances - find the distances between any vertexes ...
The combination operator tells us how to combine the factors of the objective function to form the global objective function (also called joint valuation). Marginalization is either maximization or ...
How to solve 90% of NLP problems_ a step-by-step guide
Practical Packet Analysis: Using Wireshark to Solve Real-World Network Problems by Chris Sanders English | 28 Mar. 2017 | ASIN: B06XX74R1X | 368 Pages | AZW3 | 24.73 MB Wireshark is the world's most ...
3.Use a single-subscripted array to solve the following problem. Read in 20 numbers, each of which is between 10 and 100, inclusive. As each number is read, print it only if it is not a duplicate of ...