AttachEvent 不适用于 IE11

Question

我正在尝试制作两个复选框，在任何时候都只能从中选择一个。我搜索了很多论坛并找到了一些建议。

if (document.attachEvent){
// For IE Browsers.
document.attachEvent("DOMContentLoaded", function (event) {

    var saSelector = document.querySelector('input[name=saWrite]');
    var cgSelector = document.querySelector('input[name=cgWrite]');

    if (cgSelector !== null) {
        cgSelector.attachEvent('change', function (event) {
            if (cgSelector.checked) {
                document.querySelector('input[name=saWrite]').checked = false;
            }
        }); 
    }

    if (saSelector !== null) {
        saSelector.attachEvent('change', function (event) {
            if (saSelector.checked) {
                document.querySelector('input[name=cgWrite]').checked = false;
            }
        }); 
    }       
});
}

我用 addEventListener 代替非 IE 浏览器的 attachEvent 编写了一个类似的函数。这适用于 Firefox。但是这种方法不知何故不适用于IE。我在这里做错了什么吗？任何的意见都将会有帮助。我希望我可以为此使用 JQuery。但是我不能。

Answer 1

https://jsfiddle.net/20g7ym8q/

你说你想使用 JQuery 但你不能。我意识到开始这似乎是一个真正的限制，但事实并非如此。 JQuery 能做的任何事，JavaScript 都能做。

您的代码无法在 IE11 上运行，因为 attachEvent 已被弃用并删除，取而代之的是接受 addEventListener 作为在所有现代浏览器中附加事件的标准方式。如果您正在寻找没有 JQuery 且没有代码重复的世代支持，那么设置您自己的对象以用作您的代码和浏览器之间的中间层可能是解决此问题的最佳方法。

 function $(ele) {
  return {
    ele: document.querySelector(ele),
    on: function(ev, fn) {
      (document.attachEvent) ? 
      this.ele.attachEvent(ev, fn) :
      this.ele.addEventListener(ev, fn);
    },
    checked: function(change) {
     if(typeof change !== undefined) this.ele.checked = change;
     return this.ele.checked;
    }
  }
}

上面是return一个Object，有两个方法和一个属性的函数。它的工作方式与 JQuery 类似，以提高熟悉度和一致性，但没有包含整个 JQuery 库的开销。

这些方法允许您使用 .on 添加事件，事件类型和函数作为参数。这些方法还允许您设置或获取指定元素的选中属性。 .checked() 将简单地 return 一个关于是否选中该框的布尔值，.checked(boolean) 将元素属性设置为所需状态。

实际上，要解决只有一个允许复选框的困境，您可以这样做：

var sa = $('input[name="saWrite"]');
var cg = $('input[name="cgWrite"]');

cg.on('click', function(ev) {
  sa.checked(false)
});

sa.on('click', function(ev) {
  cg.checked(false);
});

AttachEvent 不适用于 IE11

AttachEvent Not Working on IE11

html

javascript

jsp

attachevent