【问题标题】:Multiple checkboxes check as in Gmail多个复选框检查与 Gmail 中一样
【发布时间】:2010-12-30 21:58:15
【问题描述】:

我正在尝试使用复选框复制 Gmail 的行为,选择整个范围单击一个,然后按住 shift 键单击另一个,它们之间的复选框将发生变化。

但是,我在 Firefox 和 Chrome 之间遇到了兼容性问题,因为单击复选框可以正常工作,但是单击标签的处理方式却大不相同,因为 Firefox 在单击 shift 时显然不会触发更改。

You can check and test my code here.

很明显 Firefox 和标签有问题,我尝试触发复选框的 change(),但它与复选框的行为相反,我尝试使用 preventDefault()“重置”标签事件,然后触发 change() 事件,问题似乎是一样的,但现在 Chrome 有这个 bug (我认为这是正确的方法,首先同源化)。

最简单的方法是检测浏览器,但每个 Web 开发大师都告诉我们,识别问题比识别浏览器更好,那么有什么好的解决方法呢?此外,它在 IE 中不起作用,因为它不支持indexOf()

谢谢!

【问题讨论】:

  • 您可以使用 Mozilla 文档 (developer.mozilla.org/en/JavaScript/Reference/Global_Objects/…) 中的 indexOf 实现来为没有它的浏览器添加该功能。
  • 题外话:除了浏览器的问题,我认为你的逻辑有些问题。在按下 shift 进行多次随机点击后,我开始注意到复选框的行为并没有真正的意义。
  • 您知道,“点击”事件是一种普遍接受的方式,而不是更改方式。我很确定不同的浏览器在更改方面存在问题。
  • 不是一个完整的解决方案(对不起,孩子们需要食物)。这是一些可能有用的重构。 jsfiddle.net/Prxdn/3
  • @bdukes,是的,我会使用它,但首先@Ilya Kogan,很奇怪,它对我来说很好用。 @Christian,好的,我试试,谢谢。 @rcravents,嘿,谢谢,但它不起作用..

标签: javascript jquery firefox google-chrome checkbox


【解决方案1】:

由于某种原因,标签在 Firefox 中突出显示文本时的工作方式有所不同。我认为它失败的原因是当您按住 shift 并单击标签时,它不会选中该框,因此不会触发标签事件。

看看这个:http://jsfiddle.net/xerf/Prxdn/10/

这适用于 webkit 和 FireFox。我将标签更改为跨度标签。使用一点 CSS,您可以修复填充。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-03-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多