如何阻⽌点击其他区域，input框会失去焦点事件
如何阻⽌点击其他区域，input输⼊框会失去焦点位置
在开发过程中，总会碰到以下两个情况：
1. 要求点击某个区域，阻⽌input框 (或者设置了 contenteditable=“true” 的编辑区)失去焦点。
2. 要求像输⼊框那种点击选择表情、图⽚等要求保留原来焦点的位置的情况。因为⼀失去焦点位置，除⾮是往最前⾯或最后⾯插
⼊，否则要想在原来的地⽅插⼊内容是很难的。
接下来就分享⼀下个⼈的⼀些⽅法总结。
阻⽌失去焦点
<div id="test">test dom</div>
event .preventDefault();
return false;
};
接下来是怎么防⽌失去焦点位置
通过a标签
主要思路是在要点击的元素外层套⼀个a标签，设置href=“javascript: ;”，阻⽌浏览器的默认事件。
个⼈强烈推荐使⽤该⽅式，没有兼容性问题，不会影响其他事件。
<a href="javascript: ;">
click dom
</a>
设置user-select为none：
通过css样式实现，设置user-select为none即可，不过user-select兼容性不太好。
user-select
语法：
user-select：none |text| all | element
默认值：text
.chick-dom{
moz-user-select: -moz-none;
-moz-user-select: none;
-o-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none;
input框禁止输入-ms-user-select:none;
user-select:none;
}
通过js阻⽌默认事件
主要思路是禁⽌页⾯选择以及⿏标右键
return false;
};
return false;
};
οncοntextmenu ⿏标右键事件
onselectstart 页⾯选择事件
通过内联js实现
实现⽅法是和上⼀个⼀样的
<body οncοntextmenu="return false;" onselectstart="return false">

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。