简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

Dynamic addition, deletion, modification and query of table information based on jQuery, with left/right click prompts (original from Zjmainstay)_jquery

WBOY
Release： 2016-05-16 17:51:21
Original
1481 people have browsed it

Online demo: http://demo.jb51.net/js/2012/jqueryAutoAddDeleteTableTr/jqueryAutoAddDeleteTableTr_leftClick.html
//Left click

Copy the code The code is as follows:



jQuery 动态增删表格















































































               
              1
              2
              3
              4
              5
              6



向上增加一行
修改当前一行
向下增加一行
删除当前行




jqueryAutoAddDeleteTableTr_rightClick.html
//右键（含屏蔽浏览器右键功能）
复制代码 代码如下:



jQuery 动态增删表格















































































               
              1
              2
              3
              4
              5
              6



向上增加一行
修改当前一行
向下增加一行
删除当前行




jqueryAutoAddDeleteTableTr_leftClick_addsearch.html
//左键添加查询功能
复制代码 代码如下:



jQuery 动态增删表格



























































































               
1 2 3 4 5 6 7 8
a b c d e f g h
A B C D E F G H
aa bb cc dd ee ff gg hh
111 222 333 444 555 666 777 888
1a 2b 3c 4d 5e 6f 7g 8h



向上增加一行
修改当前一行
向下增加一行
删除当前行




PS:
var addToTrTop = 10;
var addToTrLeft = 534;

var addToTdLeft = 60; //If addToTdLeft is set, addToTrLeft will be invalid

indicates prompt DIV clickTips The offset from the top and left of the current tr can be modified by yourself. It can be a negative number to move up or to the left.

Software download: Download
Author: Zjmainstay　　
Source: http://www.cnblogs.com/Zjmainstay/
Related labels：
动态增删 表格信息
source：php.cn
Previous article：Summary of JQuery code I have collected over the years_jquery Next article：jQuery.each() usage sharing_jquery
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Dynamically modify inline CSS styles in Javafx I'm trying to change the background image of a pane when the application is maximized. My ...
From 2024-04-06 20:57:16
0
1
487
Problems encountered when using opentbs to generate odt files: values ​​of the same key are displayed in the same row instead of separate columns. I'm using a library called OpenTbs to create odt using PHP, I'm using it because columns a...
From 2024-04-06 20:18:18
0
1
483
CSS only method to dynamically modify image src on click without using JavaScript I need to change the src of an image on mouse click using only css like img:active{}
From 2024-04-06 19:25:49
0
1
505
Status update not working in React-Native on Android I have some code that has pairs of images in a swipeable horizontal gallery. Now when you ...
From 2024-04-06 16:54:10
0
1
410
How can I match the text width to the width of a dynamically sized image/title? See this codepen: https://codepen.io/allen-houng/pen/XGMjMr?editors=1100#0<div><i...
From 2024-04-06 10:04:43
0
2
386
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！