目录
一、jQuery选择器选择选中的或者disabled的选择框时attr函数无效二、jQuery each函数的break/continue
三、jQuery 获取元素的left会值/left数值
四、js 监听元素触摸/划屏动作
五、没设置导致$(window).height()不准确问题
六、jQuery获取/设置/监听下拉选择select的值
七、jQuery获取/设置/监听输入框input的值
八、js拼接html字符串时要注意先把单引号及双引号转义,不然可能会出现页面错误
九、绑定在scroll里面的方法在手机里面经常会等滚动完后再执行,有一定的延时,如何能缩短响应速度?
十、许多li间的drag and drop拖放的实现
十一、顺序执行时,用js控制删除transition css3效果后再新加transition,旧的transition还生效
十二、返回顶部
十三、完美支持所有端的[复制到剪贴板]js插件-clipboard.js
十四、H5通过WebViewJavascriptBridge与APP进行交互时,H5获取APP的数据的异步时间不确定的问题。
十五、返回底部
十六、获取当前网站根域
十七、Url编码转义
十八、JSON与字符串互转
十九、jQuery样式选择器及样式名中最好不要出现大写字母,否则可能在webview里面执行不成功
二十、使用fastclick.js时如果用label包住checkbox或者radio按钮里面同时出现其他如span或者i元素时,在ios里会出现点击不了的情况
二十一、slice与splice的使用
二十二、删除页面上所有的img和iframe
二十三、js能过userAgent判断各种设备终端
二十四、document.body.scrollTop 一直都是 0 的问题
二十五、原生js获取元素宽高
二十六、jQuery获取元素位置、宽高
二十七、js动态加载脚本
二十八、javascript 操作符(~、&、|、^、<<、>>)(操作数是32整数范围内)
二十九、audio标签声音文件如何重播?replay?
三十、js中如何使用FormData或者Ajax方式上传文件
三十一、js中的call、apply、bind的使用方法
三十二、加载js用async和defer的区别
三十三、非cookie情况下,前端实现访问终端的唯一标识:Fingerprintjs2
三十四、Debounce和Throttle的区别
三十五、原生js做上拉到底部加载
三十六、js正则过滤emoji表情输入
三十七、WPS2013造成的HTML5 file.type值异常
三十八、js如何判断网络是否正常
三十九、在QQ/微信浏览器里面使用el.scrollTo(0, 0)无效的问题
四十、js如何实现input=file对要上传的图片进行预览
四十一、如何创建一个干净的对象
四十二、0 == '' // => true的坑
四十三、ios8的坑。Dom类数组,要先转为数组才可以使用forEach进行遍历
四十四、为什么要用sessionStorage?
四十五、js操作视频相关用法
四十六、ios/ie11中new Date('2017-08-11 12:00:00')设置日期不成功问题
四十七、canvas图片绘制后转图片url跨域问题Tainted canvases may not be exported
四十八、创建一个a链接 使用a.click()模拟点击,主流浏览器可以,但是在ie10以下不能生效
本文同步发布到 http://www.kt5.cn/fe/2019/11/04/js-jquery/
一、jQuery选择器选择选中的或者disabled的选择框时attr函数无效
jQuery代码如下:
if (!$obj.prop("disabled")){//用prop选择或者设置对象值 $obj.prop("checked", This.prop("checked")); }
或者
$obj.is(":checked");
二、jQuery each函数中如何实现break/continue
jQuery代码如下:
return false;//break return true;//continue
三、jQuery 获取元素的left会值/left数值
$obj.position().left;//获取数值 $obj.css("left");//获取值-如1px
四、js 监听元素触摸/划屏动作
var el=document.getElementById("example"), startPos = { x: 0, y: 0 }, currentPos = { x: 0, y: 0 }; el.addEventListener('touchstart', function (event) { startPos = { x: event.changedTouches[0].pageX, y: event.changedTouches[0].pageY }; }, false); el.addEventListener('touchmove', function (event) { event.preventDefault();//阻止默认的触屏滚动动作 currentPos = { x: event.changedTouches[0].pageX, y: event.changedTouches[0].pageY }; }, false); el.addEventListener('touchend', function (event) { currentPos = { x: event.changedTouches[0].pageX, y: event.changedTouches[0].pageY }; if (currentPos.x != startPos.x){ //你左右划动 } if (currentPos.y != startPos.y){ //你上下划动 } startPos = { x: 0, y: 0 }, currentPos = { x: 0, y: 0 }; }, false);
五、没设置导致$(window).height()不准确问题
只要在页面顶部加上就可以
<!DOCTYPE html>
六、jQuery获取/设置下拉选择select的值
$(obj).val();//获取 $(obj).val(val);//设置
$(obj).change(function(){ //监听选择修改 });
七、jQuery获取/设置/监听输入框input的值
$(obj).on("input propertychange",function(){//监听
var val=$(this).val(),//获取
$(obj2).val(val);//设置
});
八、js拼接html字符串时要注意先把单引号及双引号转义,不然可能会出现页面错误
htmlStr = htmlStr .replace("'","'").replace('"','"');//"是双引号转义,'是单引号转义
九、绑定在scroll里面的方法在手机里面经常会等滚动完后再执行,有一定的延时,如何能缩短响应速度?
/** * 简易的事件添加方法 * http://www.zhangxinxu.com/wordpress/2013/04/js-mousewheel-dommousescroll-event/ * * @param {Element} el * @param {String} type * @param {Function} fn * @param {Boolean} capture */ window.addEvent = (function (window, undefined) { var _eventCompat = function (event) { var type = event.type; if (type == 'DOMMouseScroll' || type == 'mousewheel') { event.delta = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3; } if (event.srcElement && !event.target) { event.target = event.srcElement; } if (!event.preventDefault && event.returnValue !== undefined) { event.preventDefault = function () { event.returnValue = false; }; } /* ......其他一些兼容性处理 */ return event; }; if (window.addEventListener) { return function (el, type, fn, capture) { if (type === "mousewheel" && document.mozHidden !== undefined) { type = "DOMMouseScroll"; } el.addEventListener(type, function (event) { fn.call(this, _eventCompat(event)); }, capture || false); } } else if (window.attachEvent) { return function (el, type, fn, capture) { el.attachEvent("on" + type, function (event) { event = event || window.event; fn.call(el, _eventCompat(event)); }); } } return function () { }; })(window); // 主要是用touch代替scroll来监听 addEvent(document.body, 'touchstart', function (event) { startY = event.changedTouches[0].pageY; }, false); addEvent(document.body, 'touchmove', function (event) { currentY = event.changedTouches[0].pageY; Y = currentY - startY; if (Y > 10) { // 向上滚动执行 } else if (Y < -10) { // 向下滚动执行 } }, false);