要将表单输入字段设置为只读并禁用自动填充,可以使用以下解决方法:
HTML代码示例:
CSS代码示例:
input[readonly] {
background-color: #f1f1f1; /* 设置只读字段的背景颜色 */
}
在上述代码中,我们使用readonly
属性将输入字段设置为只读,autocomplete="off"
属性禁用自动填充。CSS样式将只读字段的背景颜色设置为灰色(可以根据需要进行调整)。
请注意,尽管设置了autocomplete="off"
属性,某些浏览器可能仍然会显示自动填充下拉框。在这种情况下,可以使用JavaScript解决该问题。
JavaScript代码示例:
var inputFields = document.querySelectorAll('input[readonly]');
inputFields.forEach(function(input) {
input.setAttribute('autocomplete', 'new-password');
});
上述代码使用document.querySelectorAll
选择所有具有readonly
属性的输入字段,并使用setAttribute
将autocomplete
属性设置为new-password
,以确保浏览器不会显示自动填充下拉框。
下一篇:表单输入字段之间的计算