sunxp-java 2022-01-14 07:43 采纳率: 77.8%
浏览 90
已结题

点击input输入框变颜色

img

img

在点击input输入框时,改变输入框的颜色;但点击时并没有变色,而在点击其他地方才变色

  • 写回答

2条回答 默认 最新

  • 归来巨星 前端领域新星创作者 2022-01-14 08:35
    关注
    
    <!--
     * @Author: your name
     * @Date: 2021-12-30 16:59:23
     * @LastEditTime: 2022-01-14 08:34:43
     * @LastEditors: your name
     * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
     * @FilePath: /未命名文件夹/123.html
    -->
    <!DOCTYPE html>
    
    <html>
    
    <head>
    
    <meta charset="UTF-8">
    
    <title>color</title>
    
    <style type="text/css">
    
    * {margin: 0; padding: 0;}
    
    .main {margin: 50px auto; width: 400px;}
    
    .inp {
    
    width: 200px;
    
    height: 30px;
    
    border:1px solid #999;
    
    outline:none;
    
    }
    
    </style>
    
    </head>
    
    <body>
    
    <div class="main">
    
    <input class="inp" onfocus="dian()" onblur="quxiao()" />
    
    <script language="javascript">
    
    // 鼠标点击后调用的方法
    
    function dian(){
    
    document.getElementsByTagName('input')[0].style.border = '1px solid red';
    
    }
    
    // 鼠标移开表单点击其他后调用的方法
    
    function quxiao(){
    
    document.getElementsByTagName('input')[0].style.border = '1px solid #999';
    
    }
    
    </script>
    
    </div>
    
    </body>
    
    </html>
    

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
  • ZionHH 2022-01-14 09:24
    关注

    css就可以了

    input:focus {
            border-color: red;
    }
    
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 1月22日
  • 已采纳回答 1月14日
  • 创建了问题 1月14日

悬赏问题

  • ¥15 spyder运行重复
  • ¥15 有偿做一个PUBG识别枪械配合罗技宏的
  • ¥15 我考考你,这代码是对的还是错的?
  • ¥15 我用C语言easyx图形库绘制了一个3d游戏方框透视,但进入游戏时候鼠标准星对准方框边缘 鼠标光标就会弹出来这是啥情况怎样让光标对准绘制的方框点击鼠标不弹出光标好烦这样
  • ¥20 用Power Query整合的问题
  • ¥20 基于python进行多背包问题的多值编码
  • ¥15 相同型号电脑与配置,发现主板有一台貌似缺少了好多元器件似的,会影响稳定性和使用寿命吗?
  • ¥15 C语言:数据子序列基础版
  • ¥20 powerbulider 导入excel文件,显示不完整
  • ¥15 paddle训练自己的数据loss降不下去