有时候明明是些很简单的东西，因为自己的一些大意，可能就在那圈子里一直兜兜转转，好久都绕不出来。

所以我也愿意把这些很简单的愚蠢写出来，与君共享~

首先大家知道<input>有一个名叫“button”的type，它的可见与否由“disabled”属性决定。

下面的代码，我的原意是一个输入框和三个按钮。在点击“编辑”按钮前，另外三个都属于“不可用”状态，点击以后方能恢复可用。

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

    function edit(){

      document.getElementById("editCode").disabled = true;

      document.getElementById("inviteCode").disabled = false;

      document.getElementById("randomCode").disabled = false;

      document.getElementById("submitCode").disabled = false;

    }

</script>

</head>

<body>

    <h3>邀请码设置</h3>

    <s:form>

        <table cellspacing="">

            <tr>

                <th>当前邀请码:</th>

                <td><input type="text" name="inviteCode" id="inviteCode" value="" class="input" size="" disabled/></td>

                <td><input type="button" name="randomCode" id="randomCode" value="随机获取" disabled/></td>

            </tr>

            <tr align="right">

                <td><input type="button" name="editCode" id="editCode" value="编辑" onclick="edit()"/></td>

                <td><input type="submit" name="submitCode" id="submitCode" value="确定" disabled/></td>

            </tr>

        </table>

    </s:form>

</body>

</html>

很简单，就是在edit()函数里将各个元素的disabled类型设置为可用或者不可用。

中间我遇到了个很大的问题导致我一直以为自己找的解决方法不可用，那就是我将元素命名为“edit”、“submit”等等，可能与本身一些内容发生了冲突。审查元素后报错：object is not a function.

改名后一切得到解决。

js实现input button从不可用变为可用的更多相关文章

  1. input ,button, textarea 1)使用disabled , 2) 显示值, 3) 表单提交. 4) jquery.form.js ajaxSubmit() 无刷新ajax提交表单.

    1.使用disabled input , button  textarea 可以 被 禁用, 禁用的效果 : 1) 上面的点击事件无法使用 --- button       : 下面的 onclick ...

  2. JS改变input的value值不触发onchange事件解决方案 （转）

    方法(一)(转载的网络资料) 需要了解的知识     首先,我们需要了解onchange和onpropertychange的不同: IE下,当一个HTML元素的属性改变的时候,都能通过 onprope ...

  3. selenium web driver 使用JS修改input属性

    selenium获取input时候,发现type=”hidden” 的input无法修改value,经牛人指点,可以使用js修改 首先html源文件如下,设置为text .hidden.submit ...

  4. js auto hover button & html5 button autofocus

    js auto hover button & html5 button autofocus input // html 5 <input name="myinput" ...

  5. PHP——0128练习相关2——js点击button按钮跳转到另一个新页面

    js点击button按钮跳转到另一个新页面 投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论 点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么 ...

  6. <asp:TextBox><asp:LinkButton><input button>调用后台方法后刷新页面

    <asp:TextBox><asp:LinkButton>服务器控件,执行后台方法,会回调加载js,相当于页面重新加载,刷新页面 <input button>不能直 ...

  7. 通过js动态创建button

    通过js动态创建button 一.实例描述 通过JS的DOM对象,实现元素的动态创建. 二.效果 三.代码 <!DOCTYPE html> <html lang="zh-c ...

  8. JS限制input输入的为数字并且有小数的时候最多保留两位小数

    JS限制input用户输入的为数字并且有小数的时候最多保留两位小数,代码如下: html部分: <input type="number" onkeypress="r ...

  9. JS 捕获 input 中 键盘按键

    JS 捕获 input 中 键盘按键 的相应处理事件是很简单的,google搜索一下很容易找到处理方式,请看如下一种简单的处理方式: HTML代码: <div> <input typ ...

随机推荐

  1. hdu_1254_推箱子（双BFS）

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=1254 题解:以箱子为主体,第一层BFS,然后用第二层BFS来判断人是否可以到达,这里细节比较多,要注意 ...

  2. LVS负载均衡的三种模式和八种算法总结

    三种LVS负载均衡模式 调度器的实现技术中,IP负载均衡技术是效率最高的,IP虚拟服务器软件(IPVS)是在linux内核中实现的｡ LVS负载均衡模式---1.NAT模式 NAT用法本来是因为网络I ...

  3. Postgres数据库在Linux中的I/O优化

    I/O 优化1 打开 noatime方法: 修改 /etc/fstab2 调整预读方法: 查看 sudo blockdev --getra /dev/sda 设置 sudo blockdev --se ...

  4. jq插件开发总结

    http://www.cnblogs.com/silverLee/archive/2009/12/22/1629925.html jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jQue ...

  5. Linux添加用户user到用户组group

    添加用户:useradd niot 添加到组:usermod -a -G root niot 改密码:passwd niot 切换:su - niot 查看用户组:groups 将一个用户添加到用户组 ...

  6. Stack-overflow, how to answer

    How to Answer Welcome to Stack Overflow! Thanks for taking the time to contribute an answer. It's be ...

  7. PID控制学习笔记（二）

    不管是基本的PID控制还是变形的PID控制算法,其核心都是对输入信号(设定值信号.测量信号或者偏差信号等)做基本的比例.积分.微分运算,最终提供给被控过程良好的调节信号. 在过程控制仪表,特别是在数字 ...

  8. Tomcat服务器

    常见的web服务器 1. WebLogic是BEA公司的产品,是目前应用最广泛的web服务器,支持J2EE规范(J2EE里有13种技术),商业产品,收费的.银行,证券等对并发,安全要求高的时候用,一般 ...

  9. Java R&W Related

    In Java, byte = 8 bit, char = 16 bit In C/C++, char = 8 bit There is difference because Java uses Un ...

  10. php des 加密类

    <?php/** *@see Yii CSecurityManager; */class Des{ public static function encrypt($data,$key){ $mo ...