当前位置:编程学习 > JAVA >>

JQuery操作tr和td内容

[javascript]  
<pre name="code" class="html"><html xmlns="http://www.w3.org/1999/xhtml">  
<head id="Head1" runat="server">  
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
    <link href="../esstec_css/style.css" type="text/css" rel="stylesheet" media="all" />  
    <link href="../esstec_css/style.nk.css" rel="stylesheet" type="text/css" />  
    <script src="../js/jquery-1.7.2.min.js" type="text/javascript"></script>  
    <link href="../esstec_css/Default.css" rel="stylesheet" type="text/css" />  
    <link href="../esstec_css/BMS-Form.css" rel="stylesheet" type="text/css" />  
    <script type="text/javascript">  
        $(document).ready(function () {  
            $("#selEmployee").click(function () {  
                var $table = $("#tbProEmployee tr");  
                var len = $table.length;  
                var trid = "tbProEmployee" + len;  
                var strDeviceTr = "<tr id=" + trid + ">";  
                strDeviceTr += "<td ><input id=\"txtEmployeeInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"" + "123" + "\" /><input id=\"txtInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"\" />";  
                strDeviceTr += "<label id=\"txtEmployeeName\">" + "姓名" + "</label></td>";  
                strDeviceTr += "<td><input id=\"txtRemark\" type=\"text\" name=\"ProjectEmployee\" /></td>";  
                strDeviceTr += "<td ><a href=\"javascript:;SaveProEmployee('" + trid + "')\">保存</a> | <a href=\"javascript:;DelProEmployee('" + trid + "')\">删除</a></td>";  
                strDeviceTr += " </tr>";  
                $("#tbProEmployee").append(strDeviceTr);  
            });  
        });  
        function SaveProEmployee(index) {  
            //ajax保存  
            var tr = $("tr[id=" + index + "]");  
            var employee = tr.find("#txtEmployeeName").text();  
            var remark = tr.find("#txtRemark").val();  
            var strtd = "<td><input id=\"txtEmployeeInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"" + "123" + "\" /><input id=\"txtInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"\" />";  
            strtd += "<label id=\"txtEmployeeName\">" + employee + "</label></td>";  
            strtd += "<td ><label id=\"txtRemark\">" + remark + "</label></td>";  
            strtd += "<td ><a href=\"javascript:;UpdateProEmployee('" + index + "')\">修改</a> | <a href=\"javascript:;DelProEmployee('" + index + "')\">删除</a></td>";  
            tr.html(strtd);  
        }  
        function UpdateProEmployee(index) {  
            //ajax保存  
            var tr = $("tr[id=" + index + "]");  
            var employee = tr.find("#txtEmployeeName").text();  
            var remark = tr.find("#txtRemark").text();  
            var strtd = "<td><input id=\"txtEmployeeInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"" + "123" + "\" /><input id=\"txtInnerID\" type=\"hidden\" name=\"ProjectEmployee\" value=\"\" />";  
            strtd += "<label id=\"txtEmployeeName\">" + employee + "</label></td>";  
            strtd += "<td><input id=\"txtRemark\" type=\"text\" name=\"ProjectEmployee\" value=\"" + remark + "\" /></td>";  
            strtd += "<td ><a href=\"javascript:;SaveProEmployee('" + index + "')\">保存</a> | <a href=\"javascript:;DelProEmployee('" + index + "')\">删除</a></td>";  
            tr.html(strtd);  
        }  
        function DelProEmployee(index) {  
            if (confirm("Are you sure?")) {  
                $("tr[id=" + index + "]").remove();  
            }  
        }  
    </script>  
</head>  
<body>  
    <form id="form1" runat="server">  
    <div class="snippet download-list">  
        <table class="telerik-reTable-2" id="tbProEmployee">  
            <tbody>  
                <tr>  
                    <th colspan="3">  
                 
补充:web前端 , JavaScript ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,