用jquery如何往指定表格插入数字

 时间:2024-10-11 23:11:50

1、首先看下我们的HTML代码,代码很简单,就是一个表格,表格里有几行数据,和几个输入框,一个按钮。具体代码如图,

用jquery如何往指定表格插入数字
用jquery如何往指定表格插入数字

2、运行下页面,我们看到现在页面的效果如图。

用jquery如何往指定表格插入数字

3、添加一个JS方法:add_data,通过该方法可以修改table里单元格的数据,代码如图,大概意思讲鞅瓞慈玢解下,先通过id用Jquery来找到table,然后找table里的行tr,通过传入的参数row_num,定位到是第几行的tr,然后再找这个tr下的单元格td,也是通过参数来找(c_num)。找到该单元格后,就通过Jquery的html()方法来设置该单元格的值。

用jquery如何往指定表格插入数字

4、然后为页面上的按钮添加点击事件,点击后先取到输入框里的数据,第几行,第几列的单侍厚治越元格,要更新的数据。等到这个数据后,就调用add_data方法去更新table的单元格,具体代码如图。

用jquery如何往指定表格插入数字

5、所有代码准备完毕,刷新页面,在单元格里输入参数如图,并点击‘更改’按钮。

用jquery如何往指定表格插入数字

6、点击按钮后,我们可以看到table里最后一个单元格的内容填充上了。(为什么输入的行是4?因为第一行的标题行也算是一行的)

用jquery如何往指定表格插入数字

7、我们修改输入框的数据,要改第三行,第二列的数据,如图

用jquery如何往指定表格插入数字

8、点击更改后,该单元格的数据也成功修改了。如要为指定的表格插入数据,更新数据,我们在调用add_data方法骀旬沃啭时,为第一个参数填上不同的值就行了,要改table的id为tb2的表格的数据,就把这参数改成 tb2。

用jquery如何往指定表格插入数字
  • pxcode怎么创建项目
  • C#DataTable如何设置某一行的颜色
  • IDEA中怎么设置渲染文档注释
  • 解决IOS fixed定位问题
  • Metasploit怎么连接数据库
  • 热门搜索
    朝花夕拾手抄报 关于元旦的手抄报 重阳节手抄报简单又漂亮 消防知识手抄报 七夕节手抄报 关于国庆节的手抄报 安全教育手抄报图片简单又漂亮 五年级数学手抄报 关于文明的手抄报 防溺水手抄报资料