Jquery实现的一种常用高亮效果

 

Code<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 class="demo"><li><h5>                注册选项</h5></li><li>用户名:<input type="text" value="" id="name" style="width: 200px" /></li><li>密 码:<input type="password" value="" id="pass" style="width: 200px" /></li><li>爱 好:<input type="checkbox" value="" />篮球&nbsp;<input type="checkbox" value="" />足球&nbsp;<inputtype="checkbox" value="" />音乐</li></ul></script></body></html>

时间： 2024-09-29 13:54:52

Jquery实现的一种常用高亮效果的相关文章

Jquery实现的一种常用高亮效果示例代码_jquery

如下所示: 复制代码 代码如下: <html><head>    <title>jquery</title>    <style>        body        {            font-size: 12px;        }        li        {            list-style: none;            height: 34px;            padding-top: 5px;

jquery each的几种常用的使用方法示例

 在jQuery里有一个each方法,用起来非常的爽,不用再像原来那样写for循环,下面介绍each的几种常用的用法 jQuery源码里自己也有很多用到each方法.其实jQuery里的each方法是通过js里的call方法来实现的.下面简单介绍一下call方法.   call这个方法很奇妙,其实官方的说明是:"调用一个对象的一个方法,以另一个对象替换当前对象."网上更多的解释是变换上下文环境,也有说是改变上下文this指针.    代码如下: call([thisObj[,arg1[

jquery each的几种常用的使用方法示例_jquery

jQuery源码里自己也有很多用到each方法.其实jQuery里的each方法是通过js里的call方法来实现的.下面简单介绍一下call方法. call这个方法很奇妙,其实官方的说明是:"调用一个对象的一个方法,以另一个对象替换当前对象."网上更多的解释是变换上下文环境,也有说是改变上下文this指针. 复制代码 代码如下: call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 参数 thisObj  可选项.将被用作当前对象的对象.arg1,

jQuery中常用动画效果函数(日常整理)_jquery

jquery中动画效果非常多,下面小编给大家分享一下jquery中的动画函数. jQuery的效果函数列表: animate():对被选元素应用"自定义"的动画. clearQueue():对被选元素移除所有排队的函数(仍未运行的). delay():对被选元素的所有排队函数(仍未运行)设置延迟. dequeue():运行被选元素的下一个排队函数. fadeln():逐渐改变被选元素的不透明度,从隐藏到可见. fadeOut():逐渐改变被元素的不透明度,从可见到隐藏. fadeTo(

jQuery中ajax的4种常用请求方式介绍_AJAX相关

AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分. jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详细参数选项见下. 如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml"). 实例: 保存数据到服务器,成功时显示信息. $.aj

jquery给标题增加常用的效果

jquery给标题增加常用的效果 <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

jQuery中ajax的4种常用请求方式介绍

AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分. jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详细参数选项见下. 如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml"). 实例: 保存数据到服务器,成功时显示信息. $.aj

Button的几种常用的xml背景，扁平化，下划线，边框包裹，以及按压效果

Button的几种常用的xml背景,扁平化,下划线,边框包裹,以及按压效果 分享下我项目中用到的几种Button的效果,说实话,还真挺好看的 一.标准圆角 效果是这样的 他的实现很简单,我们只需要两个参数,一个圆角的大小,一个颜色 standard_button_bg.xml <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.androi

[JQuery]用InsertAfter实现图片走马灯展示效果2——js代码重构

写在前面 前面写过一篇文章<[JQuery]用InsertAfter实现图片走马灯展示效果>,自从写过那样的也算是使用面向对象的写法吧,代码实在丑陋,自从写过那样的代码,就是自己的一块心病,总感觉不完美,心里一直惦记着那件事,也是在我写过那篇文章之后,没多久,在博客园首页看到了一篇文章较复杂js的书写格式,这里的代码看着比较简介,就想着抽时间将之前的那段js代码进行重构.说做就做,不想一想起之前写过那样的代码,心里就有疙瘩.所以也就有了这篇文章. $.extend 在开始重构之前,需要先学习一