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

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

首先大家知道<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. delete、truncate与drop的区别

    转自:SQL truncate .delete与drop区别 相同点: 1.truncate和不带where子句的delete.以及drop都会删除表内的数据. 2.drop.truncate都是DD ...

  2. hdu_4823_Energy Conversion

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=4823 题意:中文题,很清楚,要注意的是乘起来会爆int 题解: #include<cstdio& ...

  3. marzullo's algorithm

    given several intervals, how to find a interval which is a intersect of the most number of the given ...

  4. dns是什么

    域名解析服务器,靠它把你要访问的网址找到然后把信息送到你电脑上.DNS 是域名系统 (Domain Name System) 的缩写,它是由解析器和域名服务器组成的.域名服务器是指保存有该网络中所有主 ...

  5. 剑指offer青蛙跳台阶问题

    (1)一只青蛙一次可以跳上 1 级台阶,也可以跳上2 级.求该青蛙跳上一个n 级的台阶总共有多少种跳法. //递归方式  public static int f(int n) { //参数合法性验证 ...

  6. Qt之Windows开发移植问题汇总

    来源:http://blog.sina.com.cn/s/blog_a6fb6cc90101auw6.html 在用Qt开发完成项目后,就需要将其打包并且移植在其他机器上,能在其他PC机上正常跑起来才 ...

  7. C#中使用正则表达式提取超链接地址的集中方法

    一般在做爬虫或者CMS的时候经常需要提取 href链接或者是src地址.此时可以使用正则表达式轻松完成. Regex reg = new Regex(@"(?is)<a[^>]* ...

  8. ASP之Eval、Execute、ExecuteGlobal区别分析

    Eval.Execute.ExecuteGlobal 这三个语句(函数)都是执行字符串表达式,不过它们之间又有所不同. Eval 计算一个表达式的值并返回结果. 语法:[result = ]eval( ...

  9. vbscript语句

    'vbscript语句Call'[call] name [argumentlist]'把控制转移到函数或子程序.当调用函数或子程序时,Call是可写可不写的.但是如果你用了Call,那么argumen ...

  10. slf4j(simple logging facade for java)

    http://www.tuicool.com/articles/IfeUfq   slf4j(simple logging facade for java)是Java的简单的日志门面,它 不是具体的日 ...