var $table = $('.dataTable').DataTable({
......
columns: [
{
title: 'Action',
render: function (value, type, row, meta) {
return '<a href="javascript:;" class="editBtn">Edit</a>';
}
},
......
],
......
}).on('click', 'td>.editBtn', function () {
var tr = $(this).parents('tr');
var row = $table.row(tr);
var rowData = row.data();
......
});
标签: JavaScript
JavaScript 判断浏览器是否支持Html5
利用html5特有的tag判断是否支持html5
function isSupportHtml5() {
return !!document.createElement('canvas').getContext;
}
JavaScript 判断浏览器是否支持CSS3
function isSupportCss3() {
//创建一个 element
var css3Div = document.createElement('div');
//判断是否支持圆角
if ('border-radius' in css3Div.style) {
//赋值css3属性
css3Div.style['border-radius'] = '3px';
//检测css3属性赋值是否成功
return css3Div.style['border-radius'] == '3px';
}
else {
return false;
}
}
JavaScript 扩展 String 属性
JavaScript 扩展 String 属性,实现 endsWith、startsWith、trim、trimEnd、trimStart和toBytes。
//左匹配
String.prototype.endsWith = function (suffix) {
return (this.substr(this.length - suffix.length) === suffix);
}
//右匹配
String.prototype.startsWith = function (prefix) {
return (this.substr(0, prefix.length) === prefix);
}
//去前后空格
String.prototype.trim = function () {
return this.replace(/^\s+|\s+$/g, '');
}
//去结尾空格
String.prototype.trimEnd = function () {
return this.replace(/\s+$/, '');
}
//去前面空格
String.prototype.trimStart = function () {
return this.replace(/^\s+/, '');
}
//转byte数组
String.prototype.toBytes = function () {
var ch, st, re = [];
for (var i = 0; i < this.length; i++) {
ch = this.charCodeAt(i); // get char
st = []; // set up "stack"
do {
st.push(ch & 0xFF); // push byte to stack
ch = ch >> 8; // shift value down by 1 byte
}
while (ch);
// add stack contents to result
// done because chars have "wrong" endianness
re = re.concat(st.reverse());
}
// return an array of bytes
return re;
}
javascript 格式化数字
js 格式化数字,输出格式化后的字符串。
Number.prototype.format = function (format) {
if (!format) {
return this.toString();
}
var comma = ',',
dec = '.',
i18n = false,
neg = v < 0;
var v = Math.abs(this);
if (format.substr(format.length - 2) == '/i') {
format = format.substr(0, format.length - 2);
i18n = true;
comma = '.';
dec = ',';
}
var hasComma = format.indexOf(comma) != -1,
psplit = (i18n ? format.replace(/[^\d\,]/g, '') : format.replace(/[^\d\.]/g, '')).split(dec);
if (1 < psplit.length) {
v = v.toFixed(psplit[1].length);
} else if (2 < psplit.length) {
throw ('NumberFormatException: invalid format, formats should have no more than 1 period: ' + format);
} else {
v = v.toFixed(0);
}
var fnum = v.toString();
psplit = fnum.split('.');
if (hasComma) {
var cnum = psplit[0],
parr = [],
j = cnum.length,
m = Math.floor(j / 3),
n = cnum.length % 3 || 3,
i;
for (i = 0; i < j; i += n) {
if (i != 0) {
n = 3;
}
parr[parr.length] = cnum.substr(i, n);
m -= 1;
}
fnum = parr.join(comma);
if (psplit[1]) {
fnum += dec + psplit[1];
}
} else {
if (psplit[1]) {
fnum = psplit[0] + dec + psplit[1];
}
}
return (neg ? '-' : '') + format.replace(/[\d,?\.?]+/, fnum);
}
JavaScript 读取 Execl 转为 JSON
利用 SheetJS js-xlsx 读取 Execl 数据转为JSON
<script type="text/javascript" src="Script/jquery.min.js"></script>
<script type="text/javascript" src="Script/js-xlsx/shim.min.js"></script>
<script type="text/javascript" src="Script/js-xlsx/xlsx.full.min.js"></script>
<script type="text/javascript">
$(function () {
$('.file-upload').change(function () {
var $self = $(this);
if (!this.files.length) {
return;
}
//利用 FileReader 读取用户选中的Execl文件
var reader = new FileReader();
reader.onload = function (e) {
var data = new Uint8Array(e.target.result);
var workbook = XLSX.read(data, { type: 'array' });
//获取第一个 Sheet 名称
var sheetName = workbook.SheetNames[0];
//获取第一个 Sheet
var sheet = workbook.Sheets[sheetName];
//转换为JSON格式数组
var sheetJSONData = XLSX.utils.sheet_to_json(sheet);
};
reader.readAsArrayBuffer(this.files[0]);
});
});
</script>
相关文件下载
扩展 jQuery.fn.zIndex方法
扩展jquery.fn,增加获取或设置zIndex的function
/*扩展 jQuery.fn 的方法*/
jQuery.fn.extend({
/*
获取或设置zIndex
*/
zIndex: function (zIndex) {
if (zIndex !== undefined) {
return this.css("zIndex", zIndex);
}
if (this.length) {
var elem = $(this[0]), position, value;
while (elem.length && elem[0] !== document) {
// Ignore z-index if position is set to a value where z-index is ignored by the browser
// This makes behavior of this function consistent across browsers
// WebKit always returns auto if the element is positioned
position = elem.css("position");
if (position === "absolute" || position === "relative" || position === "fixed") {
// IE returns 0 when zIndex is not specified
// other browsers return a string
// we ignore the case of nested elements with an explicit value of 0
// <div style="z-index: -10;"><div style="z-index: 0;"></div></div>
value = parseInt(elem.css("zIndex"), 10);
if (!isNaN(value) && value !== 0) {
return value;
}
}
elem = elem.parent();
}
}
return 0;
}
});
汉化 jQuery UI Datepicker 控件
if (jQuery.datepicker) {
jQuery.datepicker.setDefaults({
dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
monthNamesShort: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'],
weekHeader: '周',
nextText: '下月>',
prevText: '<上月',
closeText: '完成',
currentText: '今天',
yearSuffix: '年'
});
}
JQuery UI Tabs控件扩展addTab方法
/*扩展 jQuery.browser 的属性*/
if (!jQuery.browser) {
jQuery.browser = {};
}
jQuery.extend(jQuery.browser, {
/*检查浏览器是否支持CSS3*/
css3: (function () {
var css3Div = document.createElement('div');
if ('border-radius' in css3Div.style) {
css3Div.style['border-radius'] = '3px';
return css3Div.style['border-radius'] == '3px';
}
else {
return false;
}
})(),
/*检查浏览器是否支持HTML5*/
html5: (function () {
return !!document.createElement('canvas').getContext;
})()
});
jQuery.widget("ui.tabs", $.ui.tabs, {
addTab: function (options) {
var _self = this;
options = $.extend({
title: 'New Tab', //标题
content: '', //内容
id: 'tab_' + new Date().getTime(), //Id
enableClose: true, //是否允许关闭
activate: true //是否激活
}, options || {});
var id = "tabs-" + options.id;
var tab = this.element.find('.ui-tabs-nav li[aria-controls="' + id + '"]');
if (tab.length < 1) {
var _li = $('<li></li>').append($('<a></a>').attr('href', '#' + id).html(options.title));
this.element.find(".ui-tabs-nav").append(_li);
var _div = $('<div></div>');
_div.attr('id', id);
_div.append(options.content);
this.element.append(_div);
if (options.enableClose) {
var _closeBtn = $('<span class="ui-icon ui-icon-close" role="presentation" title="关闭"></span>').click(function () {
var _this = $(this);
var panelId = _li.remove().attr("aria-controls");
$("#" + panelId).remove();
if (_li.hasClass('ui-tabs-active')) {
_self.element.tabs('option', 'active', _self.element.find(".ui-tabs-nav li").length - 1);
}
});
_li.append(_closeBtn);
}
this.refresh();
if (options.activate) {
this._activate(this.element.find(".ui-tabs-nav li").length - 1);
}
//解决不支持css3的浏览器问题
if (!$.browser.css3) {
_div.height(this.element.innerHeight() - this.element.css('padding-top').replace('px', '') - this.element.find(".ui-tabs-nav").outerHeight(true) - Math.mul(_div.css('margin-top').replace('px', ''), 2));
}
} else if (options.activate) {
var activeIndex = this.element.find(".ui-tabs-nav li").index(tab);
this._activate(activeIndex);
}
}
});
IE jscript 实现 Array.find()
由于IE 家族jscript不支持find,需要而外代码实现Array属性find的扩展
if (!Array.prototype.find) { Array.prototype.find = function (callback) { for(var i in this){ if (callback(this[i], i, this)) { return this[i]; } } return null; } }