JavaScript开发心得--如何传递某行数据给下一页
1, 应用场景
在某个html页面显示一批数据,如20个用户的名称、年龄等,每行都要一个编辑按钮,点击编辑后,将此行数据带入某个专门的编辑页进行显示,修改后保存。
问题是 点击编辑按钮后,如何得知要编辑的是哪行数据?
2, 采用隐藏的信息栏传送行号信息
本人采用在编辑栏<td>中嵌入隐藏的span信息实现,如下:
<table>
<tr>
<th>行号</th><th>车场名称</th><th>地址</th><th>申请人</th><th>申请人电话</th><th>审核操作</th>
</tr>
<tr ng-repeat="car in cars" ng-class-even="'tr-even'">
<td>{{car.rowNum}}</td><td>{{car.ParkName}}</td><td>{{car.Address}}</td>
<td>{{car.OPT}}</td><td>{{car.Tel}}</td>
<td><button onclick="DoCheck(this.innerText);">审核<span style="display: none;">{{car.rowNum}}</span></button>
</td>
</tr>
</table>
在处理函数中,分析参数,取出行号
function DoCheck(rowNumText){
//rowNumText形如: 审核1,审核2。。。
CurrRow = parseInt(substring(rowNumText,2))-1;
...
}
3,浏览器兼容问题
以上代码在IE中运行良好,但到了chrome中,发现取不出行号。参数this.innerText,只含有“审核”二字,不返回隐藏的行号。
为此,将innerText改为innerHTML,处理函数改为:
function DoCheck(rowNumText){
//rowNumText形如:审核<span class="ng-binding" style="display: none;">1</span>
var sub_string = rowNumText.substring(8,100);
var index1 = sub_string.indexOf('>');
var index2 = sub_string.indexOf('<');
CurrRow = parseInt(sub_string.substr(index1+1,index2-index1-1))-1;
。。。。
}
以上代码在IE和chrome均正常运行。
JavaScript开发心得--如何传递某行数据给下一页的更多相关文章
- Yii 1开发日记 -- Ajax实现点击加载下一页
功能实现:先输出一页的内容,然后点击加载下一页,如图 1.控制器中 /** * 消费记录:列出用户购买章节的记录 */ public function actionMyPayHis() { //点击加 ...
- 【Cocos2dx游戏开发】CCNotificationCenter传递消息和数据
在开发游戏的时候我们经常需要在层与层之间.场景与场景之间传递数据和消息,Cocos2dx框架应用观察者模式为我们封装了一个CCNotificationCenter类,也叫消息通知中心,它也是一个单例类 ...
- JavaScript开发区块链只需200行代码
用JavaScript开发实现一个简单区块链.通过这一开发过程,你将理解区块链技术是什么:区块链就是一个分布式数据库,存储结构是一个不断增长的链表,链表中包含着许多有序的记录. 然而,在通常情况下,当 ...
- MySQL命令行数据操作使用心得(总结版)
Char 0~255 Varchar 0~65535 text 0~65535(只能保存字符) Longtext 0~4294967295(只能保存字符) CMD登陆mysql mysql -u ro ...
- AEAI Portlet开发心得
1 背景概述 Portlet是AEAI Portal组件API,是基于Java的Web组件,由Portlet容器管理,并由容器处理请求,生产动态内容.AEAI Portal中已经预置了许多Portle ...
- 在Bootstrap开发框架中使用dataTable直接录入表格行数据
在Winform开发的时候,我们很多时候可以利用表格控件来直接录入数据,不过在Web上较少看到,其实也可以利用dataTable对象处理直接录入表格行数据,这个可以提高数据的录入方便,特别是在一些简单 ...
- 安卓版App开发心得
从2016年4月到6月主要做的工作是网站的开发,而6月到现在2016年8月初,主要做的工作是Android和IOS两种App的开发,又以Android为主. 将这段时间的Android开发心得记录如下 ...
- 使用SeaJS实现模块化JavaScript开发
前言 SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制.与jQuery等JavaScript框架不同,SeaJS不会扩展封 ...
- JavaScript 开发工具webstrom使用指南
本文给大家推荐了一款非常热门的javascript开发工具webstrom,着重介绍了webstrom的特色功能.设置技巧.使用心得以及快捷键汇总,非常的全面. 看到网上一篇介绍webstrom的文章 ...
随机推荐
- Django学习系列之django分页
基本语法实例 from django.core.paginator import Paginator objects = Post.objects.filter(status='published') ...
- windows 7 文件加密设置
方法/步骤1 加密文件 1 右击需加密的文件,选择“属性”命令. 2 在属性对话框的“常规‘选项卡中单击”高级“按钮. 3 在弹出的对话框中选中”加密内容以便保护数据“复选框,单击”确定“按钮. 4 ...
- 使用Charles进行网络抓包
一.安装Charles 二.使用 1.http抓包 1.1 现在我们默认是在进行iOS开发,首先确保iPhone和Mac是在同一个局域网下(连同一个WiFi).然后查看Mac的IP地址(打开网络偏好设 ...
- android不是内部或外部命令,也不是可执行的程序或批处理文件
问题: 原因:没有配置好android sdk环境变量 解决方法: (1)切换到android sdk下的tools文件夹,再执行android命令就可以启动Android SDK管理器,我的andr ...
- .net mvc4 + ajaxfileupload.js 解决IE浏览器中弹出下载对话框问题
摘要:每一个人遇到的问题都不一样,在网上找了一大圈都没有解决到我的问题!由于我的环境如标题所看到的.攻克了这个问题. 主要问题:在于响应头的设置 Controller: [HttpPost] publ ...
- APICloud平台的融云2.0集成
融云2.0的官方文档地址:http://docs.apicloud.com/端API/开放SDK/rongCloud2 项目须要IM模块,最后还是选择了融云.在iOS原生开发中,融云sdk集成了聊天界 ...
- iOS中.pch文件怎样使用
pch 能够用来存储共享信息,比方设备屏幕的宽度,高度.版本等等 公用信息 Xcode 老版本号会自己主动为我们创建pch文件,新版本号開始不自己主动创建了.假设须要使用能够自己手动创建 waterm ...
- NSoup解析处理Html
以前在做网页静态生成的时候,使用正则表达式分析提取网页链接.最近搜索了解到java有个Jsoup解析网页,对应.net有个nsoup.处理网页非常好用. Document doc = NSoupCli ...
- web前端和后端的区别
一句话,展示ui相关的就是前端,否则就是后端. 前端语言:javascript.css和html. 后端就是一些服务.
- 关于spring配置文件中编辑时没有提示信息的问题
spring配置文件头部信息主要是提供一个xml的编写规范作用. 新创建的配置文件引入头部信息后,编辑时没有提示信息,重启elipse即可解决.