jQuery练习(鼠标移来移去,焦点获得失去)_鼠标移开,获取失焦单元格的值

作者：Li_阴宅 | 2024-07-27 16:09:33

踩

鼠标移开,获取失焦单元格的值

练习链式操作等

 
 <!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>    <title>jQuery鼠标移来移去,焦点获得失去</title><script type="text/ecmascript" src="../js/jquery-1.2.6.js"></script><script type="text/ecmascript">    //添加获得焦点失去焦点    $("document").ready(function(){        $("input[@type='text'],input[@type='password'],textarea").focus(function(){            $(this).css({background:"#fcc", border:"1px solid #f00"}).blur(function(){                $(this).css({background:"transparent", border: "1px solid #ccc"})            })        });    });    //根据标签名找标签,$(input[@type='password'])多个标签之间用逗号隔开.    //$("..").focus(function(){$(this).})//链式操作用$(this)取得当前对象.    //设置css的方法:$(this).css({这里添写键值对});//形式key:"value"    //$().hover(f1(){},f2(){})//hover的用法    $(function(){        $("input[@type='text'],input[@type='password'],textarea").hover(function(){            $(this).css({background:"#369", border:"1px solid #369"})},function(){                $(this).css({background:"#f6f", border:"1px solid #f6f"})            }        )    });    //去掉这个会有小毛病    $(document).ready(function(){        if ($.browser.msie){          $("input[@type='text'], input[@type='password'], textarea").focus(function(){                $(this).addClass("focus")            }).blur(function(){                    $(this).removeClass("focus")                });        }    })    //两种链式操作方法    $(function(){        //第一种，像穿珠子，比较清晰，我比较喜欢。        //$("#d1").mouseover().mouseout()        $("#d1").mouseover(function(){            $(this).html("over");        }).mouseout(function(){            $(this).html("out");        })        //第二种，一层套一层，不大习惯。像C#语法，但又不能像那样格式。        //$("#d2").mousedown(function(){        //  $(this).css().mouseup(function(){        //      $(this).css()        //  })        //});        $("#d2").mousedown(function(){            $(this).html("down").mouseup(function(){                $(this).html("up")            })        });    });</script></head><body><div><input type="text" id="i1" /><textarea id="TextArea1" cols="20" rows="2"></textarea><div id="d1">hello</div><div id="d2">hi,hi</div></div></body></html> 

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Li_阴宅/article/detail/890829