jquery银行电子账单表格填入和编辑

前段时间做的一个银行表格账单的jquery插件,用于金额写入和编辑的应用,希望对大家有所帮助,发现问题欢迎回复

;(function($){
	 function getNum(num) {
	        num += ‘‘;
	        var num1 = num.replace(/[^0-9|\.]/g, ‘0‘);//清除字符串中的非数字非.字符
	        if (/^0+/) //清除字符串开头的0
	            num1 = num1.replace(/^0+/, ‘‘);
	        if (/^\./.test(num1)) //字符以.开头时,在开头添加0
	            num1 = ‘0‘ + num1;
	        num1 = new Number(num1);
	        num1 = num1.toFixed(2);//四舍五入保留最后两位数
	        return num1;
   	 }
	$.fn.trSet=function(options){
		var options=$.extend(this,options);
		this.each(function(){
			var _this=$(this);
			_this.find(options.trCom).on(options.elemType,function(){
				var _thisTrTd=$(this).find(options.trTd),
				_trTdPop=$(this).find(options.trTdPop),
				_trTdPicTxt=_trTdPop.find(options.trTdPicTxt),
				_thisTdText=_thisTrTd.text();

				_thisTdText=$.trim(_thisTdText);
				_thisTdText=getNum(_thisTdText),
				_thisTop=$(this).position().top,//当前tr距离父窗体距离
				_thisW=$(this).width()-5,
				_thisH=$(this).height()-5;
				_trTdPicTxt.val(_thisTdText/100); //调用数据处理函数
				_trTdPop.css({"display":"block","position":"absolute","top":_thisTop,"left":"0"});
				_trTdPicTxt.css({"width":_thisW,"height":_thisH});
				_trTdPicTxt.on(options.elemType,function(){return false});
				_trTdPicTxt.trigger("focus");
				_trTdPicTxt.blur(function(){
					var _thisVal=$(this).val();
					_thisVal=getNum(_thisVal);//调用数据处理函数
					_thisVal=_thisVal.split("");
					_thisVal.splice($.inArray(".",_thisVal),1);//去掉小数点
					_thisTrTd.text("");
					var j=parseInt(_thisTrTd.length-_thisVal.length);
					for(var i=0;i<_thisVal.length;i++){//数据填入单元格,位数匹配
						_thisTrTd.eq(j+i).text(_thisVal[i]);
					}
					_trTdPop.css("display","none");
				})
			})
		})
	}
})(jQuery);

	$(function(){
		$("#getMoney").trSet({
			trCom:".trCom",
			trTd:".tdNum",
			trTdPop:".pupTxt1",
			trTdPicTxt:".picTxt",
			elemType:"click"
		});

	})

  

亿
                     
                     
时间: 2024-10-10 03:00:47

jquery银行电子账单表格填入和编辑的相关文章

基于Birt4.6实现报表表格数据的可编辑

奇葩需求:客户要求某业务系统中生成的报表数据可以编辑.为响应客户的需求,本文基于Birt 4.6实现报表数据的可编辑(伪修改). BIRT 是以 Java 和 JavaEE 为基础为 Web 应用程序开发的基于 Eclipse 的开源报表系统,其本身并不支持报表数据的修改.因此想要实现报表数据的可编辑,需要修改生成报表的渲染页面.本文的方案是在报表生成页面引入Jquery实现报表表格数据的可编辑,这是一种简单的快速实现方式,具体实现方案如下: 1)找到Birt渲染页面 Birt的渲染页面路径..

三.jquery.datatables.js表格编辑与删除

1.为了使用如图效果(即将按钮放入行内http://www.datatables.net/examples/ajax/null_data_source.html) 采用了另一个数据格式 2.后台php,取表格数据变为: public function initable(){ $db = M('yanfa_project')->select(); // 取$db的长度 // $len =count($db); $item=array(); // 循环将$db二维数组每一项的value取出放一个数组

jquery实现的表格添加或者删除行操作

jquery实现的表格添加或者删除行操作:对于表格的使用应该是非常的熟悉了,下面是一段非常强大的代码,能够实现表格行的添加删除甚至可以对单元格进行编辑,下面就分享一下次代码,希望能够对大家有所帮助,代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.soft

EasyStruct.js轻松创建可填入式html模板结构

在前端开发的工作中,经常会碰到这样的情况,加载页面数据的时候,有一部分内容的结构是重复的,只是数据不一样.比如说论坛.贴吧里面的各个楼层,还有一些类似工资报表.销售报表的每一行,举个例子: function addTr(data1,data2,data3){ return '<tr style="text-align:center"><td style="height:40px;">'+data1+'<td><td styl

BPM实例方案分享:表单子表自动填入数据

软件环境:H3 BPM 9.2.7 业务需求: 现在想要实现一个效果:在打开表单.选择合同阶段后能够读取后台数据,将多行数据自动填入下方的子表. 本文将用三种方法实现自动填入子表的功能. 方法一 前台使用如下几个函数就可以实现了,在合同的onchange事件获取数据以后处理. 复制代码 //获取子表 var dtl = $.MvcSheetUI.GetElement("子表名").SheetGridView(); //增加子表行 dtl.addbtn.click();  或 dtl._

SQL排序后将序号填入指定字段

1.显示行号 如果数据没有删除的情况下主键与行号是一致的,但在删除某些数据,行号就与主键不一致了,这时需要查询行号就需要用新的方法,在SQL Server2005之前,需要使用临时表,但在SQL Server2005中,使用ROW_NUMBER()非常方便. 以下是一个查询语句,意思是按照cid将数据排序,然后将排序后的序号填入新建的字段rowNum. select row_number() over (order by cid) as rowNum,* from t_gene 查询结果: 2.

表单的ajax填入问题

又是表单 今天的表单是用事件委托从table里面获得eventId,用get请求从后台获得json数据填入表单中 第一个执行的比较顺利,但当再添加一个事件之后,修改(将数据填入表单)功能竟然失灵了,然后各种找原因,当把新添加的删除过后他又可以实现,但是当添加信息之后,用alert测试,他的字段获得正常,但是显示返回json的时候,无法执行,初步判断是get请求没有发送出去,至于原因还有待探索. 第二个是将从json返回的checkbook的值用for循环输出以checkbook的形式显示到相应位

jQuery如何获取表格的指定行和列

jQuery如何获取表格的指定行和列:在堆表格进行操作的时候往往要获取指定的行和咧,也就是需要进行精确的定位,本章节就简单的介绍一下如何实现此功能.一.获取指定的行:由于代码比较简单,这里就不给出完整的代码了,只给出代码片段:1.为表格最后一行单元格添加一个class类. $("#mytable tr:last").find("td").addClass("setcolor") 2. 为表格第一个行单元格添加一个class类. $($("

填入服务器配置

填入服务器配置 位置:公众服务号后台 -> 开发者中心(左侧菜单最下方) -> 配置项 服务端配置 当前以PHP为例 开发认证函数 认证辅助函数 URL入口 调用返回结果 提交服务器配置 成功返回 如果有这个提示,则证明本次服务端配置成功 失败返回 如果有这个提示,则需要验证填入的URL请求处理的过程中是否出现问题 当排查完毕之后发现处理没有出现异常,那么验证处理完成后的输出结果是否有问题,这里的验证不能只看浏览器中输出的数据,如: 显示的返回是正常的,但是就是验证失败,在这种情况下,可以通过