After Adding "readonly" attribute on text box not able to remove it in one event
Steps to repro
USE Internet Explorer- Check unlimited check box
- Click on text box (It will remove tick/check from check box)
- Try to enter text in text box
We cannot enter in the text box
4. Click again on the text box. Now we w开发者_如何转开发ill be able to enter text in the text boxWe tried by
1. Making attribute readOnly to flase i.e. $('#myinput').attr('readOnly', false); 2. Calling $('#myinput').click();Below is the HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Make input read only</title>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js"></script>
</head>
<body>
<input id="myinput" type="text" />
<input id="mycheck" type="checkbox" />
<script type="text/javascript">
/*oncheck box click*/
$('#mycheck').click(function () {
if ($(this).attr('checked')) {
$('#myinput').attr('readOnly', 'readOnly');
}
else {
$('#myinput').removeAttr('readOnly');
/* also tried
* $('#myinput').attr('readOnly', false);
* $('#myinput').attr('readOnly', '');
*/
}
});
/*on text box click*/
$('#myinput').click(function () {
$('#mycheck').removeAttr('checked');
$('#myinput').removeAttr('readOnly');
/* also tried
* $('#myinput').attr('readOnly', false);
* $('#myinput').attr('readOnly', '');
*/
});
</script>
</body>
</html>
Live copy
You need to set the readonly attribute to nothing like so
$('#myinput').attr('readOnly', '');
I had this same issue, and reported it on stackoverflow as well, one sec while I find it...
Edit: Found it.
If you read my post, it also explains what is happening. In fact, the textbox actually got unlocked (unlike what Tyde tried). The problem relates to focus/selection.
function preventBackspace(e) {
var evt = e || window.event;
if (evt) {
if (evt.srcElement.getAttribute('readonly')) {
var keyCode = evt.charCode || evt.keyCode;
if (keyCode === 8) {
if (evt.preventDefault) {
evt.preventDefault();
} else {
evt.returnValue = false;
}
}
}
}
}
I got a scenario where the textboxes will switch between readonly & editable, so I added the condition if (evt.srcElement.getAttribute('readonly')) which helped.
Use this For IE and it also works in chrome and mozilla
$('#myinput').removeAttr("readonly");
$('#myinput').select();
加载中,请稍侯......
精彩评论