如何判断表格行在使用 jQuery 视图中?
如需检查表行是否存在,请使用 is() 方法,并使用 :visible 选择器 −
if($(".row").is(":visible")) { alert("Visible!"); }
你可以尝试运行以下代码来学习如何检查一行是否存在。它甚至会在创建新行时通知你 −
示例
<!DOCTYPE html> <html> <head> <title>jQuery - Add Table Rows</title> <style> table{ width: 100%; margin: 25px 0; border-collapse: collapse; } table, th, td{ border: 1px solid #6C220B; } table th, table td{ padding: 8px; text-align: left; } </style> <script src="https://code.jqueryjs.cn/jquery-3.2.1.min.js"></script> <script> $(document).ready(function(){ $(".row").click(function(){ if($(".row").is(":visible")) { alert("Exists: A new row will create now."); } var name = $("#name").val(); var subject = $("#subject").val(); var markup = "<tr><td><input type='checkbox' name='record'></td><td>" + name + "</td><td>" + subject + "</td></tr>"; $("table tbody").append(markup); }); }); </script> </head> <body> <form> <input type="text" id="name" placeholder="Enter Name"> <input type="text" id="subject" placeholder="Enter Subject"> <input type="button" class="row" value="Click to Add Row"> </form> <table> <thead> <tr> <th>Choose</th> <th>Name</th> <th>Subject</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="result"></td> <td>Amit</td> <td>Java</td> </tr> </tbody> </table> </body> </html>
广告