应使用 layui.dropdown 替代原生 select 实现点击跳转，因其可控、无障碍友好；若必须用 select，则监听 change 事件并校验值后跳转；移动端需添加 touch-action: manipulation CSS 解决点击失灵。
直接阻止 select 点击弹出菜单是无效且危险的
原生 <select> 的点击行为由浏览器 UA 控制，Layui 的 form.render('select') 只是样式增强，不替换底层交互。强行在 click 事件里调用 e.preventDefault() 会导致：focus 失败、键盘无法导航、屏幕阅读器中断，Safari 和 Edge 中大概率失效。这不是“没写对”，而是根本走不通的路。
用 layui.dropdown 替代 select 实现点击即跳转
这是 Layui 官方推荐、可控、无障碍友好的方案。它不依赖原生 select，完全由 JS 驱动，适合“点一下就跳转”这类无选择意图的场景。
-
elem绑定一个普通按钮或文字标签，比如<span id="jump-menu">操作中心</span> -
data数组里每个对象写title和url，不要用id做跳转依据（容易和业务主键混淆） -
click回调里直接用window.open(obj.url, '_blank')或location.href = obj.url - 务必加
target: '_blank'，否则用户跳转后会丢失当前页——尤其后台系统里这是高频投诉点
layui.use(['dropdown'], function(){
var dropdown = layui.dropdown;
dropdown.render({
elem: '#jump-menu',
data: [
{title: '用户管理', url: '/user/list.html'},
{title: '日志查询', url: '/log/search.html'}
],
click: function(obj){
window.open(obj.url, '_blank');
}
});
});
如果必须沿用现有 <select> 结构，监听 change 而非点击
这是妥协方案，适用于已有表单、不能改 DOM 结构的场景。关键不是“禁用下拉”，而是把跳转逻辑从点击转移到值变更之后。
- 确保
<select>有lay-filter="jump-select" - 在
form.on('select(jump-select)', ...)回调里取this.value，不是obj.value（后者是旧值） - 跳转前校验值是否为空或默认项（如
<option value="">请选择</option>），避免误跳 - 跳转后建议重置
select值为默认项，否则用户连续点两次会重复跳转
form.on('select(jump-select)', function(data){
if (data.value) {
window.open(data.value, '_blank');
// 重置为默认项（假设第一个 option 是 placeholder）
$(this).val('');
form.render('select');
}
});
移动端点击失灵？加一行 CSS 就解决
iOS Safari 和部分安卓浏览器对 <button> 或 <span> 的点击响应延迟高，甚至被识别为双击缩放。这不是 JS 绑定问题，是 touch 行为未明确声明。
- 给触发元素所在容器加全局样式：
td, .layui-btn, #jump-menu { touch-action: manipulation; } - 不要只加在某一个按钮上，要覆盖所有可能触发跳转的元素
- 不加这句，开发时 Chrome 模拟器一切正常，真机测试第一轮必卡住
真正让跳转失败的，从来不是语法写错，而是 URL 拼错、没开新窗口、移动端 touch 行为没声明——这三个点漏掉任何一个，用户看到的就是“点了没反应”。
