javascript - 使用 querySelector 更改颜色

标签 javascript onfocus

我正在使用一本书来学习 Javascript 教程。
练习是更改 <input type="search"> 中的背景颜色使用 document.querySelector .当我尝试在搜索框中搜索没有文本的内容时,<input> 的背景变为红色。我是用 onsubmit 做的和一些有条件的。但在下一部分中,它必须使用 onfocus 返回白色背景。我没有得到。

我试过的代码是

document.querySelector('#form-busca').onsubmit = function() {
    if (document.querySelector('#q').value == '') {
        document.querySelector('#q').style.background = 'red';
        return false;
    }
}

document.querySelector('#form-busca').onfocus = function() {
    document.querySelector('#q').style.background = 'white';
}

有人能帮我吗?非常感谢!

最佳答案

几乎明白了,伙计。

改变:

document.querySelector('#form-busca').onfocus

至:
document.querySelector('#q').onfocus
修改后的代码:

正确样本:
document.querySelector('#form-busca').onsubmit = function() {
    if (document.querySelector('#q').value == '') {
        document.querySelector('#q').style.background = 'red';
        return false;
    }
}

document.querySelector('#q').onfocus = function() {
    document.querySelector('#q').style.background = 'white';
}

关于javascript - 使用 querySelector 更改颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38003099/

相关文章:

javascript - 在javascript中顺序加载文件

javascript - 用 JavaScript 改变焦点

javascript - D3.js enter() 破坏了 svg 形状动画,但更新并删除它们很好

javascript - JQGrid 自定义排序

javascript - Node.js 模块错误处理

Android( Lollipop )EditText onFocus 多次触发

html - 如何更改焦点输入上的搜索按钮?

html - 关注多个元素及其属性

窗口 onload 和窗口 onfocus

javascript - 如何正确使用 Passport.js?