Javascript 如何在firefox和chrome中为复选框触发onfocus事件
在IE中，我使用的是onfocusin事件，复选框中的所有内容都可以正常工作，但是onfocusin仅适用于IE，而不适用于其他浏览器。此外，无论在哪个浏览器中，onfocus也不适用于复选框。这里有我遗漏的东西吗？下面的示例（仅在ie中激发复选框）我正在使用asp.net 4.0Javascript 如何在firefox和chrome中为复选框触发onfocus事件,javascript,asp.net,visual-studio-2010,firefox,web-applications,Javascript,Asp.net,Visual Studio 2010,Firefox,Web Applications,在IE中，我使用的是onfocusin事件，复选框中的所有内容都可以正常工作，但是onfocusin仅适用于IE，而不适用于其他浏览器。此外，无论在哪个浏览器中，onfocus也不适用于复选框。这里有我遗漏的东西吗？下面的示例（仅在ie中激发复选框）我正在使用asp.net 4.0 <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function CheckOnFocus() {
alert('got focus');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server" onfocus="CheckOnFocus(this);"></asp:TextBox>
<br />
<asp:CheckBox ID="CheckBox1" runat="server" onfocusin="CheckOnFocus(this);" />
</div>
</form>
</body>
</html>
函数CheckOnFocus（）{
警惕（“获得焦点”）；
}
function Init () {
var form = document.getElementById ("myForm");
if ("onfocusin" in form) { // Internet Explorer
// the attachEvent method can also be used in IE9,
// but we want to use the cross-browser addEventListener method if possible
if (form.addEventListener) { // IE from version 9
form.addEventListener ("focusin", OnFocusInForm, false);
form.addEventListener ("focusout", OnFocusOutForm, false);
}
else {
if (form.attachEvent) { // IE before version 9
form.attachEvent ("onfocusin", OnFocusInForm);
form.attachEvent ("onfocusout", OnFocusOutForm);
}
}
}
else {
if (form.addEventListener) { // Firefox, Opera, Google Chrome and Safari
// since Firefox does not support the DOMFocusIn/Out events
// and we do not want browser detection
// the focus and blur events are used in all browsers excluding IE
// capturing listeners, because focus and blur events do not bubble up
form.addEventListener ("focus", OnFocusInForm, true);
form.addEventListener ("blur", OnFocusOutForm, true);
}
}
}
function OnFocusInForm (event) {
var target = event.target ? event.target : event.srcElement;
if (target) {
target.style.color = "red";
}
}
function OnFocusOutForm (event) {
var target = event.target ? event.target : event.srcElement;
if (target) {
target.style.color = "";
}
}
</script>
<body onload="Init ()">
<form id="myForm">
User name: <input type="text" value="my name"/><br />
E-mail: <input type="text" value="myname@mydomain.com"/>
</form>
</body>
函数初始化（）{
var form=document.getElementById（“myForm”）；
if（“onfocusin”形式）{//Internet Explorer
//attachEvent方法也可用于IE9，
//但如果可能，我们希望使用跨浏览器addEventListener方法
if（form.addEventListener）{//IE来自版本9
form.addEventListener（“focusin”，onFocusInfo，false）；
form.addEventListener（“focusout”，OnFocusOutForm，false）；
}
否则{
如果（form.attachEvent）{//IE在版本9之前
表格附件（“onfocusin”，OnFocusInForm）；
表格附件（“onfocusout”，OnFocusOutForm）；
}
}
}
否则{
if（form.addEventListener）{//Firefox、Opera、Google Chrome和Safari
//因为Firefox不支持DOMFocusIn/Out事件
//我们不希望浏览器检测
//焦点和模糊事件在除IE之外的所有浏览器中都使用
//捕获侦听器，因为焦点和模糊事件不会出现气泡
form.addEventListener（“focus”，onFocusInfo，true）；
form.addEventListener（“模糊”，OnFocusOutForm，true）；
}
}
}
函数onFocusInfo（事件）{
var target=event.target？event.target:event.src元素；
如果（目标）{
target.style.color=“红色”；
}
}
函数OnFocusOutForm（事件）{
var target=event.target？event.target:event.src元素；
如果（目标）{
target.style.color=“”；
}
}
用户名：
电邮：
document.addEventListener('DOMContentLoaded', function () {
document.querySelector('#checkboxname').addEventListener('focus', focusHandler);
});
function focusHandler(){
}
<input type="checkbox" id="checkboxname" name="checkboxname"/>
document.addEventListener（'DOMContentLoaded'，函数（）{
document.querySelector（“#checkboxname”）.addEventListener（'focus'，focusHandler）；
});
函数focusHandler（）{
}