How to make a input field readonly with JavaScript

2020-05-22 07:12发布

站内问答 / JavaScript
1672 7 5

I know you can add readonly="readonly" to an input field so its not editable. But I need to use javascript to target the id of the input and make it readonly as I do not have access to the form code (it's generated via marketing software)

I don't want to disable the input as the data should be collected on submit.

Here is the page I have added in the below suggestion with no luck so far:

https://www.pages05.net/engagedigital/inputReadOnly/test?spMailingID=6608614&spUserID=MTI5MDk4NjkzMTMS1&spJobID=Nzk4MTY3MDMS1&spReportId=Nzk4MTY3MDMS1

Make sure you use <body onload="onLoadBody();"> for anyone using this in the future.

7条回答
Bombasti
2楼-- · 2020-05-22 07:33

Try This : 

document.getElementById(<element_ID>).readOnly=true;
查看更多
0人赞 添加讨论(0) 举报
女痞
3楼-- · 2020-05-22 07:37 
document.getElementById("").readOnly = true
查看更多
0人赞 添加讨论(0) 举报
疯言疯语
4楼-- · 2020-05-22 07:38

Here you have example how to set the readonly attribute:

<form action="demo_form.asp">
  Country: <input type="text" name="country" value="Norway" readonly><br>
  <input type="submit" value="Submit">
</form>

查看更多
0人赞 添加讨论(0) 举报
神经病院院长
5楼-- · 2020-05-22 07:42

You can get the input element and then set its readOnly property to true as follows:

document.getElementById('InputFieldID').readOnly = true;

Specifically, this is what you want:

<script type="text/javascript">
  function onLoadBody() {
    document.getElementById('control_EMAIL').readOnly = true;
  } 
</script>

Call this onLoadBody() function on body tag like:

<body onload="onLoadBody">

View Demo: jsfiddle.

查看更多
0人赞 添加讨论(0) 举报
别忘想泡老子
6楼-- · 2020-05-22 07:42

The above answers did not work for me. The below does: document.getElementById("input_field_id").setAttribute("readonly", true);

And to remove the readonly attribute: document.getElementById("input_field_id").removeAttribute("readonly");

And for running when the page is loaded, it is worth referring to here.

查看更多
0人赞 添加讨论(0) 举报
女痞
7楼-- · 2020-05-22 07:44

I think you just have readonly="readonly"

<html><body><form><input type="password" placeholder="password" valid="123" readonly=" readonly"></input>

查看更多
0人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)