js之滚轮事件-滚动改变大小
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
window.onload = function(){
var ptS = document.getElementsByTagName('input');
console.log(ptS)
document.onclick = function(e){
var ev = window.event || e;
// console.log(ev.target.nodeName)
if(ev.target.nodeName == 'INPUT'){
ev.target.onmousewheel = function(e){
var ev = window.event || e;
if(ev.wheelDelta > 0){
//向上 +1
ev.target.value = parseInt(ev.target.value) + 1;
//阻止默认行为
return false;
}else{
//向下 -1
ev.target.value = parseInt(ev.target.value) - 1;
//阻止默认行为
return false;
}
}
//火狐兼容
if(ev.target.addEventListener != undefined){
ev.target.addEventListener('DOMMouseScroll',function(e){
var ev = window.event || e;
if(ev.detail < 0){
//向上 +1
ev.target.value = parseInt(ev.target.value) + 1;
//阻止默认行为
ev.preventDefault();
}else{
//向下 -1
ev.target.value = parseInt(ev.target.value) - 1;
//阻止默认行为
ev.preventDefault();
}
})
}
}
}
}
</script>
</head>
<body>
<h2>鼠标选中某一个input,滚动滚轮改变数字大小</h2>
<input type="text" name="" value="1" />
<input type="text" name="" value="2" />
<input type="text" name="" value="3" />
</body>
</html>
本文来自博客园,作者:JackieDYH,转载请注明原文链接:https://www.cnblogs.com/JackieDYH/p/17634775.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现