<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单操作</title>
<script language="javascript" src="scripts/jquery-1.4.1.js"></script>
<style type="text/css">
.focus:{
border:1px solid #foo;
background:#fcc;
}
input:focus,textarea:{
border:1px solid #foo;
background:#fcc;
}
</style>
<script language="javascript" type="text/javascript">
function test(){
$(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
}).blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});
});
}
</script>
</head><body><form method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text" onblur="test()" onfocus="test()"/>
</div><div>
<label for="pass">密码：</label>
<input id="pass" type="password" onblur="test()" onfocus="test()"/>
</div><div>
<label for="msg">详细信息：</label>
<textarea id="pass"></textarea>
</div>
</fieldset>
</form>
</body>
</html>
哪位大哥大姐帮我看看这个test函数好像不起作用啊？
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单操作</title>
<script language="javascript" src="scripts/jquery-1.4.1.js"></script>
<style type="text/css">
.focus:{
border:1px solid #foo;
background:#fcc;
}
input:focus,textarea:{
border:1px solid #foo;
background:#fcc;
}
</style>
<script language="javascript" type="text/javascript">
function test(){
$(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
}).blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});
});
}
</script>
</head><body><form method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text" onblur="test()" onfocus="test()"/>
</div><div>
<label for="pass">密码：</label>
<input id="pass" type="password" onblur="test()" onfocus="test()"/>
</div><div>
<label for="msg">详细信息：</label>
<textarea id="pass"></textarea>
</div>
</fieldset>
</form>
</body>
</html>
哪位大哥大姐帮我看看这个test函数好像不起作用啊？
解决方案 »
- 编辑框回车响应消息函数，不能用了
- 如何让webgis中的地图上的某一点亮起来
- 不懂急,请问javascript对象的问题?
- jquery的flexigrid插件问题：动态改变表格宽度
- FF中，如何输出选中范围的 HTML内容 ？？？
- javascript 之 ActiveXObject 一问
- 本人新接触JavaScrip，哪位大侠能给界石一下这个函数是干什么用的？
- 用什么方法，可以通过web程序判断出当前用户的windows主题设置???
- 请教:如何将别人在WEB页上提出的意见,发送到指定的邮箱?
- 在JavaScript中如何将打开后最小化的窗口再次调用时成为当前最大化窗口？
- 100分求一个JS
- 关于梅花雪树1.0的问题
把test函数删除了，直接把方法体里面的内容放到外面。。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单操作</title>
<script language="javascript" src="scripts/jquery-1.4.1.js"></script>
<style type="text/css">
.focus:{
border:1px solid #foo;
background:#fcc;
}
input:focus,textarea:{
border:1px solid #foo;
background:#fcc;
}
</style>
<script language="javascript" type="text/javascript">
/*
function test(){
$(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
}).blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});
});
}
*/
//test(); $(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
}).blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});
});
</script>
</head><body><form method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text" onblur="test()" onfocus="test()"/>
</div><div>
<label for="pass">密码：</label>
<input id="pass" type="password" onblur="test()" onfocus="test()"/>
</div><div>
<label for="msg">详细信息：</label>
<textarea id="pass"></textarea>
</div>
</fieldset>
</form>
</body>
</html>
然后再一步一步验证下去，可以用IE7或者IE8自带的工具进行DEBUG调试，
按F12呼出。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单操作</title>
<script language="javascript" src="scripts/jquery-1.4.1.js"></script>
<style type="text/css">
.focus:{
border:1px solid #foo;
background:#fcc;
}
input:focus,textarea:{
border:1px solid #foo;
background:#fcc;
}
</style>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
}).blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});
});</script>
</head><body><form method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text"/>
</div><div>
<label for="pass">密码：</label>
<input id="pass" type="password"/>
</div><div>
<label for="msg">详细信息：</label>
<textarea id="pass"></textarea>
</div>
</fieldset>
</form>
</body>
</html>
这样也不可以啊？一点效果也没有
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>表单操作</title>
<script language="javascript" src="scripts/jquery-1.4.1.js"></script>
<style type="text/css">
.focus:{
border:1px solid #ff0000;
background:#ff0000;
}
input:focus,textarea:{
border:1px solid #ff0000;
background:#ff0000;
}
</style>
<script language="javascript" type="text/javascript">
function test(){
$(document).ready(function(){
$(":input").focus(function(){<!--获得焦点调用的函数-->
$(this).addClass("focus");
});
});
$(":input").blur(function(){<!--失去焦点调用的函数 -->
$(this).removeClass("focus");
});}
</script>
</head><body><form method="post" id="regForm">
<fieldset>
<legend>个人基本信息</legend>
<div>
<label for="username">名称：</label>
<input id="username" type="text" onblur="test()" onfocus="test()"/>
</div><div>
<label for="pass">密码：</label>
<input id="pass" type="password" onblur="test()" onfocus="test()"/>
</div><div>
<label for="msg">详细信息：</label>
<textarea id="pass"></textarea>
</div>
</fieldset>
</form>
</body>
</html>test函数是可以调用，但是你加的那个样式没有加上。。你自己仔细看下
<style type="text/css">
.focus{
border:1px solid #foo;
background:#fcc;
}
input.focus,textarea{
border:1px solid #foo;
background:#fcc;
}
</style>