webApp中实现input的禁止输入和取消禁止输入

本文纯属个人碰到难题解决方法的记录。

最近在修改一个用phoneGap搭建的html5的webApp，各种不兼容问题搞得头大。由于我是初学者，以前也没有怎么接触过html5和jquery mobile，添加的控件什么在HBuilder调试好好地，放到ADT下就各种出问题。

今天记录一个问题：如何实现在A情况下点击input禁止输入，B情况下点击input可以输入。

首先，这是两个input输入框代码：

<input id="beginDate" placeholder="开始时间" />
<input id="endDate" placeholder="结束时间" />

接着，这是调用的jquery：

        var begin = document.getElementById("txtBeginDate");
var end = document.getElementById("txtEndDate");
if (value == '') {
$("#txtBeginDate").removeAttr("disabled");   //当value值为 ''时点击input可以输入
        $("#txtEndDate").removeAttr("disabled");
begin.value = getMonthStartDate();
end.value = formatDate(now);
}
if (value == 'b') {
$("#txtBeginDate").attr("disabled","true");  //当value值为 b时点击input禁止输入
$("#txtEndDate").attr("disabled","true");
begin.value = formatDate(now);
end.value = formatDate(now);
} 

这样就可以在ADT上面跑起来了。

之前尝试过readOnly，但是不知道为什么设置了，点击还是不能禁止。

另外，通过相关资料得知，在表单中disabled和readOnly的区别如下：

1、readOnly只对input(text / password)和textarea有效，disabled对于所有的表单元素都有效。

2、使用了disabled后，提交表单则该这个元素的值不会被传递出去，我们通过request是获取不到input里面的值的，而readOnly则不会。