JQuery操纵table 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="../jquery-1.9.0.min.js"></script> 
<title>Insert title here</title>
<script type="text/javascript">
$(function(){
    //var tr = $(" table  tr:odd").css("background-color","gray");
    
    $("table tr").each(function(){
        //alert($(this).find("td input").val());
        /* if($(this).find("td input").attr("type")=='checkbox'){
            $(this).find("td input").attr("disabled",true);
            //$(this).css("background-color","gray");
        } */
        callBack("b;d");
        
    });
    
    // apiData read only edit line
    function callBack(apiScids){
        removeStyle();
        if(apiScids == ""){
            return;
        }
        $("#bodys2  tr").each(function(){
             if($(this).find("td input:eq(0)").attr("type") == "checkbox"){
                var val = $(this).find("td input:eq(0)").attr("value");
                if(val!=""){
                    if(apiScids.indexOf(val)>=0){
                        $(this).find("td").attr("disabled",true);
                    }
                }
            } 
        });    
    }
    
    //移除样式
    function removeStyle(){
        $("#bodys2  tr").each(function(){
            if($(this).find("td:eq(0)").prop("disabled") == true){
                $(this).find("td").attr("disabled",false);
            }
        });    
    }
    
});

</script>

</head>
<body>
<table id ="bodys2">
<tr><td><input type="checkbox"  value='a'/><input type="text"  value='aaa'/></td><td>aa<input type="text"  value='a'/><input type="text"  value='aaaaa'/></td></tr>
<tr><td><input type="checkbox"  value='b'/><input type="text"  value='bbb'/></td><td>bb<input type="checkbox"  value='a'/><input type="text"  value='bbbb'/></td></tr>
<tr><td><input type="checkbox"  value='c' /></td><td>cc<input type="checkbox"  value='a'/><td></tr>
<tr><td><input type="checkbox"  value='d'/></td><td>dd<input type="checkbox"  value='a'/><td></tr>
<tr><td><input type="checkbox"  value='e'/></td><td>ee<input type="checkbox"  value='a'/><td></tr> 
</table>
</body>
</html>

 

posted @ 2018-06-13 17:40  aLa神灯  阅读(144)  评论(0)    收藏  举报