zoukankan      html  css  js  c++  java
  • input集合或者循环里使用jquery选择器

    <script language="javascript" src="jquery-1.6.2.min.js"></script>
    <body>
    <form>

    <table>                 
     <thead>                   
      <tr>                        
       <td width="100px" align="center"></td>
                <td width="100px" align="center">列1</td>                     
                <td width="100px" align="center">列2 </td>                         
                <td width="100px" align="center">列3</td>                   
       </tr>                  
     </thead>                  
     <tbody id="tableBody">                   
     </tbody>
     <font color='red'>选中一行点提交</font>
     <input id="btn" type="submit" value="提交" onClick="cc();"/> 
     </table>

     <hr><br><br>

     <table>                 
     <thead>                   
      <tr>                        
                <td width="150px">列1</td>                     
                <td width="150px">列2 </td>                         
                <td width="150px">列3</td>
       <td width="150px">列4</td>
       </tr>  
     </thead>                  
     <tbody id="tableBody2">
      <tr>
       <td>包含多个隐藏域
        <input type="hidden" value="1行inputValue1"/>
        <input type="hidden" value="1行inputValue2"/>
        <input type="hidden" value="1行inputValue3">
        <input type="hidden" value="1行inputValue4">
        <input type="hidden" value="1行inputValue5">
        <input name="inputValue6" type="hidden" value="1行inputValue6">
       </td>
       <td>1行2列的innerHTMl</td> 
       <td>1行3列的innerHTMl</td> 
       <td><a style="cursor: hand;" onclick="openPanel(this);">修改</a></td>
      </tr>
      <tr>
       <td>包含多个隐藏域
        <input type="hidden" value="2行inputValue1"/>
        <input type="hidden" value="2行inputValue2"/>
        <input type="hidden" value="2行inputValue3">
        <input type="hidden" value="2行inputValue4">
        <input type="hidden" value="2行inputValue5">
        <input name="inputValue6" type="hidden" value="2行inputValue6">
       </td>
       <td>2行2列的innerHTMl</td> 
       <td>2行3列的innerHTMl</td> 
       <td><a style="cursor: hand;" onclick="openPanel(this);">修改</a></td>
       <font color='red'>点修改</font>
      </tr>
     </tbody>               
     </table>

     </form>
     </body>
     <script type="text/javascript">
     $(document).ready(function() {
      var trtd="<tr align='center'><td><input type='checkBox' readonly style=' 20px;'></td>"        
         +"<td><input name='strZzfw1'  type='text' value='1行1列的值' style='40px'></td>"        
         +"<td><input name='strZzfw2'  type='text' value='1行2列的值' style='40px'></td>"        
         +"<td><input name='strZzfw3'  type='text' value='1行3列的值' style='40px'></tr>"        
        +"<tr align='center'><td><input type='checkBox' readonly style=' 20px;'></td>"        
         +"<td><input name='strZzfw1'  type='text' value='2行1列的值' style='40px'></td>"       
         +"<td><input name='strZzfw2'  type='text' value='2行2列的值' style='40px'></td>"        
         +"<td><input name='strZzfw3'  type='text' value='2行3列的值' style='40px'></tr>";   
      $("#tableBody").append(trtd);
      });
      function cc(){  
       var $chkarry = $('input[type="checkbox"]').not ($('#checkedall'));   
       $chkarry.each(function(index){                    
         if($chkarry.eq(index).attr('checked')){                
         var $item=$chkarry.eq(index).parent().parent();                
         var $ins=$item.find("input");
         alert($("input[type='text'][name='strZzfw3']", $item).val());                            
         alert($ins.eq(3).val());                                  
        }                
      });
     }

     function openPanel(obj){
      var $tr =$(obj).parent().parent();
      var $ins=$tr.children().eq(1).find("input");
      alert($("input[type='hidden'][name='inputValue6']", $tr).val());
      alert($tr.children().eq(0).children().eq(5).val());
      alert($tr.children().eq(1).html());
      alert($tr.children().eq(2).html());
      alert($tr.children().eq(3).html());
     }
    </script>

  • 相关阅读:
    JAVA基础——编程练习(二)
    JAVA基础——面向对象三大特性:封装、继承、多态
    JVM内存
    50. Pow(x, n) (JAVA)
    47. Permutations II (JAVA)
    46. Permutations (JAVA)
    45. Jump Game II (JAVA)
    43. Multiply Strings (JAVA)
    42. Trapping Rain Water (JAVA)
    41. First Missing Positive (JAVA)
  • 原文地址:https://www.cnblogs.com/yangy608/p/2184428.html
Copyright © 2011-2022 走看看