使用jQuery遍歷MVC3 WebGrid中的行使用jQuery

Question

我需要更新WebGrid中的所有記錄。

有人可以建議我如何分別訪問每一行，以便我將遍歷所有行並同時更新它們？

的HTML代碼示例：

<table class="gridTable" id="WebGrid1"> 
    <thead> 
     <tr class="gridHead"> 
      <th scope="col"> 
       <a href="/?sort=Employee+Id&amp;sortdir=ASC">Employee Id</a> 
      </th> 
      <th scope="col"> 
       <a href="/?sort=Employee+Name&amp;sortdir=ASC">Employee Name</a> 
      </th> 
      <th scope="col"> 
       <a href="/?sort=Designation&amp;sortdir=ASC">Designation</a> 
      </th> 
      <th scope="col"> 
       <a href="/?sort=Action&amp;sortdir=ASC">Action</a> 
      </th> 
     </tr> 
    </thead> 
    <tfoot> 
     <tr class="gridFooter"> 
      <td colspan="4"> 
       1 <a href="/?page=2">2</a> <a href="/?page=3">3</a> <a href="/?page=2">&gt;</a> 
       <a href="/?page=3">&gt;&gt;</a> 
      </td> 
     </tr> 
    </tfoot> 
    <tbody> 
     <tr class="gridRow"> 
      <td> 
       <span><span id="spanEmpId_1">1</span> 
        <input id="EmpId_1" name="EmpId_1" style="display: none" type="text" value="1"> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpName_1">john </span> 
        <input id="EmpName_1" name="EmpName_1" style="display: none" type="text" value="john            "> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpDesg_1">CEO </span> 
        <input id="EmpDesg_1" name="EmpDesg_1" style="display: none" type="text" value="CEO            "> 
       </span> 
      </td> 
      <td> 
       <a href="#" id="Edit_1" class="edit">Edit</a> <a href="#" id="Update_1" style="display: none" 
        class="update">Update</a> <a href="#" id="Cancel_1" style="display: none" class="cancel"> 
         Cancel</a> <a href="#" id="Save_1" style="display: none" class="save">Update</a> 
       <a href="#" id="iCancel_1" style="display: none" class="icancel">Cancel</a> <a href="#" 
        id="Delete_1" class="delete">Delete</a> 
      </td> 
     </tr> 
     <tr class="gridAltRow"> 
      <td> 
       <span><span id="spanEmpId_2">2</span> 
        <input id="EmpId_2" name="EmpId_2" style="display: none" type="text" value="2"> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpName_2">Marks </span> 
        <input id="EmpName_2" name="EmpName_2" style="display: none" type="text" value="Marks            "> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpDesg_2">TL </span> 
        <input id="EmpDesg_2" name="EmpDesg_2" style="display: none" type="text" value="TL            "> 
       </span> 
      </td> 
      <td> 
       <a href="#" id="Edit_2" class="edit">Edit</a> <a href="#" id="Update_2" style="display: none" 
        class="update">Update</a> <a href="#" id="Cancel_2" style="display: none" class="cancel"> 
         Cancel</a> <a href="#" id="Save_2" style="display: none" class="save">Update</a> 
       <a href="#" id="iCancel_2" style="display: none" class="icancel">Cancel</a> <a href="#" 
        id="Delete_2" class="delete">Delete</a> 
      </td> 
     </tr> 
     <tr class="gridRow"> 
      <td> 
       <span><span id="spanEmpId_3">3</span> 
        <input id="EmpId_3" name="EmpId_3" style="display: none" type="text" value="3"> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpName_3">Steve </span> 
        <input id="EmpName_3" name="EmpName_3" style="display: none" type="text" value="Steve            "> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpDesg_3">PM </span> 
        <input id="EmpDesg_3" name="EmpDesg_3" style="display: none" type="text" value="PM            "> 
       </span> 
      </td> 
      <td> 
       <a href="#" id="Edit_3" class="edit">Edit</a> <a href="#" id="Update_3" style="display: none" 
        class="update">Update</a> <a href="#" id="Cancel_3" style="display: none" class="cancel"> 
         Cancel</a> <a href="#" id="Save_3" style="display: none" class="save">Update</a> 
       <a href="#" id="iCancel_3" style="display: none" class="icancel">Cancel</a> <a href="#" 
        id="Delete_3" class="delete">Delete</a> 
      </td> 
     </tr> 
     <tr class="gridAltRow"> 
      <td> 
       <span><span id="spanEmpId_4">4</span> 
        <input id="EmpId_4" name="EmpId_4" style="display: none" type="text" value="4"> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpName_4">winslet </span> 
        <input id="EmpName_4" name="EmpName_4" style="display: none" type="text" value="winslet           "> 
       </span> 
      </td> 
      <td> 
       <span><span id="spanEmpDesg_4">DM </span> 
        <input id="EmpDesg_4" name="EmpDesg_4" style="display: none" type="text" value="DM            "> 
       </span> 
      </td> 
      <td> 
       <a href="#" id="Edit_4" class="edit">Edit</a> <a href="#" id="Update_4" style="display: none" 
        class="update">Update</a> <a href="#" id="Cancel_4" style="display: none" class="cancel"> 
         Cancel</a> <a href="#" id="Save_4" style="display: none" class="save">Update</a> 
       <a href="#" id="iCancel_4" style="display: none" class="icancel">Cancel</a> <a href="#" 
        id="Delete_4" class="delete">Delete</a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

Answer 1

您可以循環通過這樣

jQuery(document).ready(function(){ 

    jQuery("table tbody tr").each(function(){ 
    var get_id= jQuery(this).find('input[type=text]').attr('id'); 

    }); 


});