我有一些代码,我循环遍历页面上的所有选择框,并将.hover事件绑定到它们,以便在它们的宽度上做一些麻烦mouse on/off.
这发生在页面准备就绪并且工作得很好.
我遇到的问题是,我在初始循环后通过Ajax或DOM添加的任何选择框都不会受到事件限制.
我找到了这个插件(jQuery Live Query Plugin),但在我用插件添加另外5k到我的页面之前,我想知道是否有人知道这样做的方法,无论是直接使用jQuery还是通过其他选项.
如果删除了DOM元素,它的侦听器也会从内存中删除吗?
在JQuery中我可以做到:
$(document).on("click","a.someBtn",function(e){
console.log("hi");
});
Run Code Online (Sandbox Code Playgroud)
将事件侦听器添加到尚不存在的元素.我似乎无法弄清楚如何将事件监听器添加到尚未存在于vanilla javascript中的元素中.
以下不起作用:
query.addEventListener( "click", someListener );
Run Code Online (Sandbox Code Playgroud)
编辑
我想要做的是通过查询选择器比较项目.我正在选择尚不存在的元素querySelectorAll.它比仅仅检查标签名称更具动态性.
我正在尝试设置一个侦听所有焦点事件的侦听器.特别是我试图在输入或文本框获得焦点的任何时候倾听.根据一些研究,广泛接受的实现方法是这样的:
document.body.onfocus = function(event) {
//Check the event.target for input/textbox
//Do something
};
Run Code Online (Sandbox Code Playgroud)
但是document.body.onfocus似乎并没有激发.我认为这可能是因为该文档实际上并没有获得焦点,所以我尝试了:
document.body.focus();
Run Code Online (Sandbox Code Playgroud)
最初"设定"焦点,但这也不起作用.
关于如何在所有输入/文本框上听取焦点事件而不直接在元素本身上设置事件的任何想法?香草javascript只请,我没有使用框架.
根据接受的答案,这里有一些工作代码:
var focusHandler = function(event) {
var type = event.target.nodeName.toLowerCase();
if(type == 'input' || type == 'textarea') {
//Do something
}
};
document.body.addEventListener('focus', focusHandler, true); //Non-IE
document.body.onfocusin = focusHandler; //IE
Run Code Online (Sandbox Code Playgroud) 我有一个包含 10 列的表,我想通过使用特定addEventListener语句将一个或多个事件侦听器添加到第 5 列到第 8 列(因此请不要使用诸如 之类的内联事件element.onclick)。该表是动态的,事实上,我在编程时不知道该表在运行时将有多少条记录,因为它只会在那一刻填充数据。
我已经知道如何“瞄准”表格或表格行或指定的表格单元格以向其添加事件侦听器,但不幸的是我不明白如何将它们一次添加到某些列或一系列列(“一次”是指一个 for 循环,循环遍历每一行以获得每行所需的单元格)。
该表只是一个普通的表,如下例所示,它是通过从 csv 文件加载数据记录或通过放置在表本身的 tfoot 中的表单添加新记录来填充的。此外,由于 js 在需要时动态添加(或删除)的属性,因此可以将数据编辑到表本身中contenteditable。
如果我想向行添加事件侦听器,我首先获取行对象,然后将事件侦听器添加到其中一次:由于事件传播/委托,所有 td 元素都将根据我的需要受到影响。是否可以对列执行相同的操作?
myRow.addEventListener(input, myfunc, false);
Run Code Online (Sandbox Code Playgroud)
换句话说,是否可以执行以下操作:
myCol5.addEventListener(input, myfunc, false);
myCol6.addEventListener(mouseover, myfunc, false);
myCol7.addEventListener(click, myfunc, false);
myCol8.addEventListener(input, myfunc, false);
Run Code Online (Sandbox Code Playgroud)
myRow.addEventListener(input, myfunc, false);
Run Code Online (Sandbox Code Playgroud)
myCol5.addEventListener(input, myfunc, false);
myCol6.addEventListener(mouseover, myfunc, false);
myCol7.addEventListener(click, myfunc, false);
myCol8.addEventListener(input, myfunc, false);
Run Code Online (Sandbox Code Playgroud)