前端常用小代码
简介
jquery通过name属性取值的方法
jquery通过name属性取值的方法
//input
$("input[name='title']").val();
//textarea
$("textarea[name='remark']").val();
//select
$("select[name='region[province]']").val();
$("select[name='province']").val();
$("#"+id+" select").find("option:first").prop("selected", true);
//checkbox
$("input:checkbox[name='test']:checked").each(function() { // 遍历name=test的多选框
$(this).val(); // 每一个被选中项的值
});
//设置选中
$('#cb').prop('checked', true);
$("input[name='_checkbox']:checked");
$("input[name='sfz']").attr("checked","checked");
//获取是否选中
var isChecked = $('#cb').prop('checked');
//或
var isChecked = $('#cb').is(":checked");
$("[name='https_origin_type'][value='1']").prop("checked", true);//设置值为1的为选中
//radio
$("input[name='']:checked").val();
$(":radio[name='level']:checked").val();
$('input:radio:first').prop('checked', true);
$("input[name='radioName'][value=2]").prop("checked",true);
//原生方法
document.querySelector('input[name="control_name"]').getAttribute('value');
document.querySelector('meta[name="csrf-token"]').getAttribute('content');
//Jquery清空(获取)当前页面所有的input和textarea的两种写法
$("#myform input,#myform textarea").each(function(){
this.value = this.value.replace(/\&/g,"%26");//也可以清空数据this.value ="";
})
$("#myform").find("input,textarea").each(function(){
this.value = this.value.replace(/\&/g,"%26");//也可以清空数据this.value ="";
});
$body.off('click', options.elem).on('click', options.elem, function(){}
$(".addPackage").unbind("click");
$(".addPackage").click(function () {})
$(document).off("click",'.change-goods');
$(document).on('click','.change-goods',function () {})
事件冒泡导致栈内存溢出以及jquery的trigger触发事件的问题
$(‘#demo’).trigger(‘click’)并不能触发a标签中内容的点击事件,只是相当于触发了a本身的onclick,而不是像用户点击一样的事件。
如果需要a标签的点击效果,需要把事件绑定到a标签内部的元素中才可以,正好html结构里面a标签内部有个类名.des的div标签
//html
<a class="layui-btn" href="http://www.yuemeet.com/" id='demo'>阻止冒泡</a>
//js
$('#demo').click((event)=>{
event.stopPropagation();
});
$('#demo').on("click",function(){
$('#demo .des').trigger('click')
});
---------------------
原文:https://blog.csdn.net/qingzhizhenhun/article/details/79245495
//弹出层事件绑定
$(document).on(‘click’, ‘#test’, function() {
layer.msg(‘响应点击事件’);
});
//js动态加载HTML元素时出现的无效的点击事件
$("body").delegate(".layui-icon-delete","click", function(){
$(this).parent().remove();
});
变量作为对象的key
var lastWord = 'last word';
var a = {
'first word': 'hello',
[lastWord]: 'world'
};
a['first word'] // "hello"
a[lastWord] // "world"
a['last word'] // "world"
字符串和数组转换
//数组转字符串
var a, b,c;
a = new Array(a,b,c,d,e);
b = a.join('-'); //a-b-c-d-e 使用-拼接数组元素
c = a.join(''); //abcde
//字符串转数组
var str = 'ab+c+de';
var a = str.split('+'); // [ab, c, de]
var b = str.split(''); //[a, b, +, c, +, d, e]
//js字符串转json对象
//jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象
$.parseJSON( jsonstr );
JSON.parse(jsonstr); //可以将json字符串转换成json对象
JSON.stringify(jsonobj); //可以将json对象转换成json对符串
eval('(' + jsonstr + ')'); //可以将json字符串转换成json对象,注意需要在json字符外包裹一对小括号
//js判断字符串是否包含某个字符
var str = "123";
console.log(str.indexOf("3") != -1 ); // true
// 判断数组中是否存在某个元素
placeholder中实现换行
使用
placeholder="单个添加:支持多源,一行一个 批量添加:域名---源站IP,如:www.baidu.com ---127.0.0.1,一行一个"
判断浏览器
/**
* 获取当前浏览器类型
*/
function myBrowser() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
if (userAgent.indexOf("MSIE") >= 0) {
return 'ie';
} else if (userAgent.indexOf("Firefox") >= 0) {
//firefox
return 'Firefox';
} else if (userAgent.indexOf("Chrome") >= 0) {
//Chrome
return 'Chrome';
} else if (userAgent.indexOf("Opera") >= 0) {
//Opera
return 'Opera';
} else if (userAgent.indexOf("Safari") >= 0) {
//Safari
return 'Safari';
} else if (userAgent.indexOf("Netscape") >= 0) {
//Netscape
return 'Netscape'
}
return false;
}
css隐藏滚动条
//chrome 和Safari
.element::-webkit-scrollbar { width: 0 !important }
.element { -ms-overflow-style: none; }
.element { overflow: -moz-scrollbars-none; }