preventDefault()对一个多选择，不同的行为在Firefox - IE - Chrome

preventDefault() on a multi-select, different behavior on Firefox - IE - Chrome

本文关键字：Firefox Chrome IE 一个 preventDefault 选择      更新时间：2023-09-26

我正在努力选择多个鼠标事件。我没想到在2015年不同浏览器的行为会有这样的差异…

我基本上试图模拟Ctrl+点击只有点击，便于使用。它在Chrome上工作，使用preventDefault()，通过取消默认行为(选择当前选项并取消选择其他选项)

select.addEventListener('mousedown', function(evt) {        
    evt.preventDefault();        
    evt.target.selected = !evt.target.selected;
    return false;
}, true);

这里是小提琴，你可以检查不同的浏览器:https://jsfiddle.net/fzvkw1xv/

  • 铬→
  • Firefox→就像preventDefault()不一样做任何事。
  • IE 11 ->没有选项get

我想实现的是对多选择的完全控制，以获得更好的用户体验。

我找不到任何相关的文档，我不知道哪个浏览器有问题，或者标准的预期行为是什么。任何信息，这将是非常感激。我开始考虑让复选框看起来像一个多选择框。

不同的浏览器有不同的处理事件的方式。

除了事件捕获之外还有事件冒泡。你也得停下来。

发现事件传播模型:http://javascript.info/tutorial/bubbling-and-capturing

尝试更广泛的解决方案:

function (event) {
  event = event || window.event // Cross-browser event
  event.preventDefault(); // Stop event capturing
  // Stop event bubbling
  if (event.stopPropagation) { // W3C standard variant
      event.stopPropagation();
  } else { // IE variant
      event.cancelBubble = true
  }
  return false;
}
http://javascript.info/tutorial/default-browser-action

相关文章：