如何判斷表格行在使用 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.jquery.com/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>

更新於: 20-6 月-2020

926 次瀏覽

開啟你的 職業生涯

完成課程獲得認證

開始
廣告
© . All rights reserved.