扫码关注官方订阅号
我想要的效果是点击下拉菜单的时候，不要展开下拉菜单。
光阴似箭催人老，日月如移越少年。
你没有说清楚实现这个场景的目的，让人难以理解需求。
如果单纯不让用户点击，方法有很多，你可以给他覆盖一层透明的， 也可以给他绑定点击事件，在事件中拦截默认动作，还可以用图片去代替这个下拉框，骗用户却不让他点。
不管怎样，下拉框在那里却不能点挺让人不舒服的。 select有个disable属性，也完全能够做到让你看，不让你点。
另外在你问题的第一个评论中：
Humphry · 5天前 要说HTML4有什么原生表单组件最为难用，select首当其冲。 个人推荐模拟的：http://aui.github.io/popupjs/doc/selectbox.html
他说的内容其实是我更推荐的，这个模拟select库我问过作者，目前腾讯Qzone在产品环境中用这个库，我觉得值得信赖。
猜测是编辑文章（估且这么认为）时不希望让用户修改分类吧。
因为 select 没有 readonly 状态，所以你可以在判断为编辑文章时，在页面中放一个 input type=hidden，然后用文本显示出当前值。
input type=hidden
如果一定要添加一个 select 的话，可以这样。
<select name="category" disabled> <option>1</option> <option>2</option> </select> <input type="hidden" name="category" />
你也可以使用 select2，它能够模拟出下拉框的 readonly 状态。
select.on('click',function(e){e.preventdefault()});
给个class="disabled".disabled {pointer-events: none;}
class="disabled"
.disabled {pointer-events: none;}
<!DOCTYPE html> <html> <head> <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <select id="select"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <script> // 我相信用户是可以接受若干毫秒的闪烁。同时该组件又能保持change等一系列原属性 $('#select').on('focus', function() { $(this).hide(); setTimeout(function(this) { $(this).show(); }.bind(this)); }); </script> </body> </html>
设置一个width和height都和这个下拉框相同的透明p，覆盖在上面，为了显示出该select组件不能用，可将其opacity设置为0.6，IE下记得设置filter alpha
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
0 
5
648
收藏
你没有说清楚实现这个场景的目的，让人难以理解需求。
如果单纯不让用户点击，方法有很多，你可以给他覆盖一层透明的， 也可以给他绑定点击事件，在事件中拦截默认动作，还可以用图片去代替这个下拉框，骗用户却不让他点。
不管怎样，下拉框在那里却不能点挺让人不舒服的。
select有个disable属性，也完全能够做到让你看，不让你点。
另外在你问题的第一个评论中：
他说的内容其实是我更推荐的，这个模拟select库我问过作者，目前腾讯Qzone在产品环境中用这个库，我觉得值得信赖。
猜测是编辑文章（估且这么认为）时不希望让用户修改分类吧。
因为 select 没有 readonly 状态，所以你可以在判断为编辑文章时，在页面中放一个
input type=hidden，然后用文本显示出当前值。如果一定要添加一个 select 的话，可以这样。
你也可以使用 select2，它能够模拟出下拉框的 readonly 状态。
select.on('click',function(e){e.preventdefault()});给个
class="disabled".disabled {pointer-events: none;}设置一个width和height都和这个下拉框相同的透明p，覆盖在上面，为了显示出该select组件不能用，可将其opacity设置为0.6，IE下记得设置filter alpha