排序sort
sort() 方法用于对数组的元素进行排序。
语法: arrayObject.sort(sortby)
sortby 可选。规定排序顺序。必须是函数。
sort方法根据数组中对象的某一个属性值进行排序:
function compare(property){
return function(a,b){
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
}
}
var arr = [
{name:'Danny',age:10},
{name:'Bob',age:18},
{name:'Alice',age:8}
];
arr.sort(compare('age'));
最后结果是
{name:‘Alice’,age:8}
{name:‘Danny’,age:10}
{name:‘Bob’,age:18}
获取tr的索引
一般用$(this).index()
但如果两个tr之间穿插了script标签,获取其他的东西,会导致index获取不正确
可以用
/**
* [get_tr_index 获取tr所在的索引]
* @param {[type]} obj [tr对象]
* @return {[type]} [description]
*/
function get_tr_index(obj){
return $(this).index('tr');
}
该方法是获取当前tr在所有tr中的索引,包括其他table下的,仅获取当前table或者当前tbody下的tr可用下面的形式:
/**
* [get_tr_index 获取tr所在的索引]
* @param {[type]} obj [tr对象]
* @return {[type]} [description]
*/
function get_tr_index(obj){
return $(obj).parents('tbody').find('tr').index($(obj));
}
获取元素相对父元素的位置(偏移)-position()
该方法返回的对象包含两个整型属性:top 和 left,以像素计。
此方法只对可见元素有效。
$(selector).position()
获取元素相对文档的位置(偏移)-offset()
该方法返回或设置匹配元素相对于文档的偏移(位置)。
该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。
$(selector).offset()
单选按钮的checked操作
- 问题: 使用removeAttr(‘checked’)无效
removeAttr(‘checked’)可以去掉jquery添加的checked,无法去掉点击加的 - 解决: 换prop
$(':radio').prop('checked', false);
$(':radio').eq(0).prop('checked', true);
const、let、var区别
声明方式 | 变量提升 | 作用域 | 初始值 | 重复利用 |
const | 否 | 块级 | 需要 | 否 |
let | 否 | 块级 | 不需要 | 否 |
var | 是 | 函数 | 不需要 | 是 |
监控input内容变化
$('#id').on('input propertychange',function(){
})
获取英文字符串长度
String.prototype.getBytesLength = function() {
var totalLength = 0;
var charCode;
for (var i = 0; i < this.length; i++) {
charCode = this.charCodeAt(i);
if (charCode < 0x007f) {
totalLength++;
} else if ((0x0080 <= charCode) && (charCode <= 0x07ff)) {
totalLength += 2;
} else if ((0x0800 <= charCode) && (charCode <= 0xffff)) {
totalLength += 2;
} else{
totalLength += 2;
}
}
return totalLength;
}
截取指定长度的字符串(英文长度)
String.prototype.getBytesByLength = function(_len) {
var totalLength = 0;
var charCode;
for (var i = 0; i < this.length; i++) {
charCode = this.charCodeAt(i);
if (charCode < 0x007f) {
totalLength++;
} else if ((0x0080 <= charCode) && (charCode <= 0x07ff)) {
totalLength += 2;
} else if ((0x0800 <= charCode) && (charCode <= 0xffff)) {
totalLength += 2;
} else{
totalLength += 2;
}
if (totalLength > _len) {
return this.substring(0, i);
} else if (totalLength == _len) {
return this.substring(0, (i+1));
}
}
return this.substring(0, _len);
}
输入框只能输入数字
oninput="value=value.replace(/[^\d]/g,'')"
Element.scrollIntoView()
让当前的元素滚动到浏览器窗口的可视区域内。
如果元素本身就在可视区域内时不需要挪动位置,可用
Element.scrollIntoView({block: “nearest”})
对象深拷贝和浅拷贝
浅拷贝:
只是想备份数组,但是只是简单让它赋给一个变量,改变其中一个,另外一个就紧跟着改变
var arr1 = [1, 2, 3, '4'];
var arr2 = arr1;
arr2[1] = "test";
console.log(arr1); // [1, "test", 3, "4"]
console.log(arr2); // [1, "test", 3, "4"]
深拷贝:
定义一个新的对象,遍历源对象的属性 并 赋给新对象的属性。改变其中一个,另外一个不会跟着改变
var obj1 = {
name:'小陈',
age: 23
}
var obj2 = $.extend(true, {}, obj1);
obj1.age = 24;
console.log(obj1); //Object {name: "小陈", age: 24}
console.log(obj2); //Object {name: "小陈", age: 23}
js触发a标签的href链接
- 说明:
$(‘xxx’).click()只能触发绑定的onClick方法,不能跳转到href - 解决办法:
$(‘xxx’)[0].click()
因为a标签的href属性是在他dom中的0里面,需要点击那个0才能实现,而数字型的属性名不能用“.”来获取,故写成[0]。
获取复选框选择值,多个以逗号分隔
$('[name="investor_id[]"]:checked').map(function(index,elem) {
return $(elem).val();
}).get().join(',')
禁止某些按钮事件冒泡
可以直接使用event.stopPropagation();
阻止时间冒泡,但如果a标签使用data-remote="true"
打开弹窗,加上onclick="javascript:event.stopPropagation();"
会导致弹窗出错,这时候就可以在父级onclick事件里判断触发click事件的元素是不是需要禁掉的那个元素,如果是就阻止
function select_one_params (obj) {
if (event.target && event.target.tagName != "TR" && $(event.target).hasClass("event_stopPropagation")) {
// 我这里判断阻止非tr标签&含有event_stopPropagation的class触发后面的代码
return;
}
// code
}