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

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

首先大家知道<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. Hadoop中的一些基本操作

    先粗略说一下“hadoop fs”和“hadoop dfs”的区别:fs是各比较抽象的层面,在分布式环境中,fs就是dfs,但在本地环境中,fs是local file system,这个时候dfs不可 ...

  2. 缓存2 动态缓存 memcached

    01准备下载好memcached.exe文件-->放置c:\memcached目录中02准备下载好php_memcache.dll文件-->放置php\ext扩展目录中03配置 php.i ...

  3. linux下shell命令trap

    某些时候,在执行shell脚本(.sh)时,我们并不希望被打断.这时我们要用到trap命令. 例如: 在shell脚本中,忽略“终止”信号 trap  ' '   TERM

  4. LeetCode OJ 108. Convert Sorted Array to Binary Search Tree

    Given an array where elements are sorted in ascending order, convert it to a height balanced BST. 把一 ...

  5. POJ2524：Ubiquitous Religions （并查集模板）

    Description There are so many different religions in the world today that it is difficult to keep tr ...

  6. Java中判断字符串中相同字符的个数

    public static int countStr(String str1, String str2) { int counter=0; if (str1.indexOf(str2) == -1)  ...

  7. Windows中安装jdk，出现javac不是内部或外部命令 也不是可运行的程序

    在经过多次实验,终于解决了在dos窗口验证jdk是否安装成功的错误提示-----javac不是内部或外部命令 也不是可运行的程序 首先要明确的是 在新建 JAVA_HOME , CLASSPATH文件 ...

  8. 剑指offer 旋转数组

    class Solution { public: int minNumberInRotateArray(vector<int> rotateArray) { //常规的遍历方法时间是O(N ...

  9. CSS中常见中文字体的英文名称(Microsoft YaHei,SimHei)

    Mac OS的一些: 华文细黑:STHeiti Light [STXihei]华文黑体:STHeiti华文楷体:STKaiti华文宋体:STSong华文仿宋:STFangsong儷黑 Pro:LiHe ...

  10. 如果更新包更新包现场，class文件更新过去，没有改变，及时删掉，照样能进那个模块的问题。

    这是打更新包需要注意的问题: 带$的同名文件也需要copy过来打更新包,不能只更新一个class文件,找了1天的错误,简直日乐购.