zoukankan      html  css  js  c++  java
  • 输入框为空时,按钮灰色不可点

    <!DOCTYPE html>
    <html>
        <head lang="en">
            <meta charset="UTF-8">
            <title>测试页面</title>
        </head>
        <body>
            <form  style="display: inline" onsubmit="return false" action="##" method="post">
                {% csrf_token %}
                <div>
                    <label for="user_id">用户名:</label>
                    <input type="text" name="username" maxlength="35" onblur="checkInput()" oninput="changeBtnable()" autofocus required id="user_id" placeholder="请输入用户名">
                </div><br/><br/>
                <button type="submit" id="btn" disabled onclick="add_user()" class="btn btn-primary">
                    <i class="fa fa-plus" aria-hidden="true"></i> 添加用户
                </button>&nbsp;&nbsp;
                <button type="submit" id="btn1" disabled  onclick="reset_pwd()" class="btn btn-primary">
                    <i class="fa fa-repeat" aria-hidden="true"></i> 密码重置
                </button>&nbsp;&nbsp;
                <button type="submit" id="btn2" disabled  onclick="chk_user()" class="btn btn-primary">
                    <i class="fa fa-trash" aria-hidden="true"></i> 删除用户
                </button>
            </form>
        
            <script language="JavaScript" type="text/javascript">
                function changeBtnable(){
                    $("#btn").removeAttr("disabled");
                    $("#btn1").removeAttr("disabled");
                    $("#btn2").removeAttr("disabled");
                }
           //button 加disable 属性,shizhi function changeBtndisable(){ $(
    "#btn").attr("disabled","true"); $("#btn1").attr("disabled","true"); $("#btn2").attr("disabled","true"); }
           //检测输入框是否为空 function checkInput(){ var text
    = $("#user_id").val(); if(text==null||text==""){ changeBtndisable(); } } </script> </body> </html>

     搞定

    IT运维开发路上的点点滴滴。。。
  • 相关阅读:
    Dart语言--基础内容
    Vuex入门介绍
    videojs中文文档详解
    在Vue中如何使用axios请求拦截
    vue监听滚动事件,实现滚动监听(scroll滚动)
    font-family:中文字体的英文名称 (宋体 微软雅黑)
    VUE项目中按需引入ECharts.js
    VUE 重载组件
    【Web】网站主如何更改网页标签的图标(favicon.ico)
    我的电脑cmd命令引入sql数据库
  • 原文地址:https://www.cnblogs.com/weijie0717/p/15186105.html
Copyright © 2011-2022 走看看