更改边框/颜色onFocus [英] change border/color onFocus

问题描述

我试着制作一个脚本，在专注于

I tried to make script which changes color of border-bottom of div after having focus on

<input type="text">

然后点击其他地方后改回默认颜色。

and then changing back to default color after clicking somewhere else.

这是我试过的：

Css：

.div1 {border-bottom:1px solid #ccc;}

Javacript：

Javacript:

function inputFocus(){ $(".div1").css("border-bottom","1px solid #ffba00"); };

Html：

<input type="text" onFocus="inputFocus();">

第一部分（改变焦点上的颜色）工作正常，但点击其他地方后（没有焦点）在输入上）它没有改变回css文件中设置的正常样式。

The first part (changing color on focus) works fine, however after clicking somewhere else (not having focus on input) it doesnt change back to normal style as set in css file.

任何想法我做错了什么？

any idea what im doing wrong?

推荐答案

我建议：

$('input').focus(
    function(){
        $(this).css('border-bottom','1px solid #000');
    }).blur(
        function(){
            $(this).css('border-bottom','1px solid #ccc');
        });​

JS Fiddle demo 。

虽然你是否适合使用CSS：

Though if you're amenable to CSS:

input:focus,
input:active {
    border-bottom: 1px solid #000;
}

JS小提琴演示。

这篇关于更改边框/颜色onFocus的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！