使用JavaScript检查Firefox上的输入元素

Question

我正在开发一个扩展，它监听元素上的单击事件。

现在我有两个问题：

1. 是否有检测元件是输入要素的便捷方式？像HTML中的input，textarea和XUL中的textbox一样。
2. 如果用户点击一个输入元素，如何获取用户点击的位置？ 例如，有一个<input>元素，其值设置为blah，并且用户在'l'和'a'之间单击，我如何获得索引（在本例中为2）？

Answer 1

每个事件都有一些数据在事件参数中传递。你可以做这样的事情要弄清楚什么是点击：

function clickFun(event){ 
    if (event.target.nodeName == "INPUT") { 
     var type = event.target.getAttribute('type').toLowerCase(); 
     if (type == 'text') { 
      console.log('text input'); 
     } else if (type == 'checkbox') { 
      console.log('checkbox'); 
     } 
    } else if (event.target.nodeName == "TEXTAREA") { 
     console.log('text area'); 
    } 
} 
thing.onclick = clickFun; 

你可以做到这一点与jQuery它给你一些简单的功能检查有关元素的信息。如果你想尝试一个JavaScript框架，就由你决定。

$(':input').click(function(event){ 
    var $this = $(this); 
    if ($this.is(':text')) { 
     console.log('text input'); 
    } else if ($this.is(':checkbox')) { 
     console.log('checkbox'); 
    } else if ($this.is(':textarea')) { 
     console.log('textarea'); 
    } 
}); 

要得到光标所在的位置时，他们在文本框中单击或地区尝试检查出的这篇文章：

http://www.dedestruct.com/2008/03/22/howto-cross-browser-cursor-position-in-textareas/

Answer 2

＃1：这是方便使用jQuery的“：输入“选择器像这样：

if ($(node).is(":input")) 
    alert("It's an input element!"); 

但通常，我不认为有一个简单的方法来告诉XUL元素。枚举节点名称是我能想到的最简单的解决方案。