jquery表格编辑,jquery 表格

jquery双击事件,双击表格变为可编辑

$("table 手续费td").dbclick(function(){

    var td = $(this);

    // 根据表格文本创建文本框 并加入表表中--文本框的样式自己调整

    var text = td.text();

    var txt = $("input type='text'").val(text);

    txt.blur(function(){

        // 失去焦点，保存值。于服务器交互自己再写,最好ajax

        var newText = $(this).val();

        

        // 移除文本框,显示新值

        $(this).remove();

        td.text(newText);

    });

    td.text("");

    td.append(txt);

});

相关问答

Q1: jquery表格行进行编辑 如何获取当前的行数据

jquery代码

$(".myclass").each(function(){

$("#sub",this).click(function(){

// alert(1)

alert($(this).parents("tr").html());

});

});

});

表格html代码

table border="1"

tr class="myclass"

thMonth/th

thSavings/th

thinput id="sub" type="submit" /input/th

/tr

tr class="myclass"

tdJanuary/td

td$100/td

thinput id="sub" type="submit" /input/th

/tr

/table

通过$(this)获取所点击的按钮，

$(this).parents(“tr”)获取按钮所在行，

$(this).parents(“tr”).find(“.”).text()获取按钮所在行class为的元素的值。

Q2: 如何用jquery改变表格单元格的内容

var td=$("#你这个单元格的id");//当然了，这只是id选择器去获取标签对象，还有其他很多选择器！

$(td).html("你要改变的内容");

Q3: jquery 表格控件怎么使用

1、使用简单、扩展方便。

2、表格样式可自定义，只需修改相应的CSS样式即可。

3、支持行点击事件自定义。

4、支持复选框选择行。

5、执行列排序（支持数字、日期时间、英文、汉字等）。

6、支持自定义行按钮及按钮事件（如编辑、删除按钮等）

7、支持自定义数据的显示样式（根据当前数据或当前行数据）

8、支持分页显示数据，且在插件内部实现分页处理。

二、使用说明

该插件的使用，基本只需两个步骤即可，一个是表格的声明（创建），然后就是数据的加载。

1、表格的声明（创建）

var objTable = new HyTable({

columns: [

{name: '姓名', mapping: 'username', type: 'string', width: '100', allowSort: true, renderer: function(val){return val;}}

], //(array)列信息

emptyMsg: "暂无数据", //(string)无数据时的提示信息

renderTo: "", //(string)表格容器，必须是HTML元素的ID属性值

model: 'remote', //(string)模式，远程(remote)or本地(local)

url: '', //(string)远程模式的获取数据的url地址

allowPaging: true, (bool)//是否分页

pageSize: 20, //(int)每页显示的行数

checkSelected: false, //(bool)复选框选择

selectedField: "", //(string)复选框选中字段

stripeRows: false, //(bool)是否启用隔行变色 默认不启用

onRowClick: null //(function)行点击事件

});

2、表格数据的加载

objTable.loadData(1,data);//第一个参数为加载页的页索引，第二个参数有两种情况，1：如果参数内容是JSON对象，则表示是查询的查询条件，如果是数据，则表示直接加载本地数据到表格中。