• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

javascript - Bootstrap 选择不会在移动设备上触发更改事件

[复制链接]
菜鸟教程小白 发表于 2022-12-12 14:18:09 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

我正在使用 Bootstrap select将原生选择转换为 twitter bootstrap下拉列表。

我的问题是 change 事件未在 PC 上的普通浏览器中的 iOS 或 Android 设备上触发,它是否正常工作。如果我使用库的原生元素支持,则会在这些设备上触发更改事件。

  $('.selectpicker').selectpicker({
      style: 'btn-info',
      size: 4
  });


var submitSearchForm = function() {
    $(this).parents('form').submit();
};


$('.selectpicker').on('blur change', submitSearchForm);

谁有想法?



Best Answer-推荐答案


经过测试(ios-safari 和 chrome、android chrome、桌面 chrome 和 FF),对我来说效果很好。

jsfiddle:Demo with the plugin and latest Bootstrap

问题不在于插件,可能与一些额外的代码有关。

为测试和调试做一些微小的改变:

  • 删除模糊事件 - 当您单击选择框时,它将提交您的表单,由于某种未知原因,插件焦点并在单击选择框时立即模糊选择框。
  • 确保您在 DOM 就绪状态下触发您的 js - 使用 $(function(){ }); 或将您的脚本放在结束 BODY 标记之前。
  • 更改选择器 - 默认情况下,插件会识别 .selectpicker,仅用于测试,请确保它不会添加一些可能导致不良行为的不良事件。
  • 使用扩展名为 jQuery debuger 的 chrome devtools安装。使用检查器选择选择框 -> 转到“jQuery 事件”选项卡并确保附加了“更改”事件并且只有他,另一个“更改”事件可能会导致问题。
  • 确保表单没有附加 ~"submit"事件 - 它可能会阻止表单提交。
  • 确保表单标签的 Action 属性设置正确或根本没有定义。确保选择框是表单的子项并且表单已正确关闭。

很明显,问题是由我们看不到的您的附加代码引起的 - 如果这些测试对您不起作用,请添加您的代码或重现您遇到的问题的演示,我们将更有能力为您提供帮助。

关于javascript - Bootstrap 选择不会在移动设备上触发更改事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28433197/

回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注0

粉丝2

帖子830918

发布主题
阅读排行 更多
广告位

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap