Jquery实现的一种常用高亮效果示例代码_Javascript教程-查字典教程网
Jquery实现的一种常用高亮效果示例代码
Jquery实现的一种常用高亮效果示例代码
发布时间:2016-12-30 来源:查字典编辑
摘要:如下所示:复制代码代码如下:jquerybody{font-size:12px;}li{list-style:none;height:34p...

如下所示:

复制代码 代码如下:

<html>

<head>

<title>jquery</title>

<style>

body

{

font-size: 12px;

}

li

{

list-style: none;

height: 34px;

padding-top: 5px;

}

</style>

<script type="text/javascript" src="jquery-1.2.6.pack.js"></script>

<script type="text/javascript">

$(document).ready(function(){

var oInputs = $("ul.demo input");

oInputs.each(function(i){

oInputs.eq(i).focus(function(){

oInputs.eq(i).parent().css("background-color","ccf");

}).blur(function(){

oInputs.parent().css("background-color","");

})

});

oInputs.focus(function(){

$(this).css("background-color","ff9").blur(function(){

$(this).css("background-color","");

});

})

})

</script>

</head>

<body>

<ul>

<li>

<h5>

注册选项</h5>

</li>

<li>用户名:<input type="text" value="" id="name" /></li>

<li>密 码:<input type="password" value="" id="pass" /></li>

<li>爱 好:<input type="checkbox" value="" />篮球<input type="checkbox" value="" />足球<input

type="checkbox" value="" />音乐</li>

</ul>

</script>

</body>

</html>

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类