首页 > 其他 > 详细

输入框为空时,按钮灰色不可点

时间:2021-08-25 18:01:16      阅读:12      评论:0      收藏:0      [点我收藏+]
<!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>

技术分享图片技术分享图片

 

 搞定

 

输入框为空时,按钮灰色不可点

原文:https://www.cnblogs.com/weijie0717/p/15186105.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!