【JavaScript】Js控制页面所有元素只读
在页面初始化加载以下readOnlyPage()方法,可实现所有元素只读,方便实用。
<script language="javascript">
function readOnlyPage(){
elements = document.all;
for ( var i = 0; i < elements.length; i++) {
setReadonlyOfElement(elements[i]);
}
} function setReadonlyOfElement(iElement){
var elementType = iElement.type;
if ((elementType == "hidden") || (elementType == "password") ||
(elementType == "text") || (elementType == "textarea")){
if(iElement.setReadonlyFlag==true){
return;
}else{
iElement.setReadonlyFlag = true;
}
if(iElement.onblur!=null){
iElement.oldOnblur = iElement.onblur;
iElement.onblur = functionDoNothing;
}
if(iElement.ondblclick!=null){
iElement.oldOndblclick = iElement.ondblclick;
iElement.ondblclick = functionDoNothing;
}
if(iElement.onfocus!=null){
iElement.oldOnfocus = iElement.onfocus;
iElement.onfocus = functionDoNothing;
} if(iElement.className!=null){
iElement.oldClassName = iElement.className;
}
iElement.className="readonly";
iElement.readOnly = true;
}
// 不要把按钮设只读
//else if(elementType=="button"){
// if(iElement.setReadonlyFlag==true){
// return;
// }else{
// iElement.setReadonlyFlag = true;
// }
//}
else if(elementType == "checkbox"){
setCheckBoxReadonly(iElement,true);
}
else if(elementType == "radio"){
setRadioReadonly(iElement,true)
}else if(elementType == "select-one"){
if(iElement.setReadonlyFlag==true){
return;
}else{
iElement.setReadonlyFlag = true;
}
var optionTags = new Array();
var index = 0;
var optionObj;
var elementValue = iElement.value;
var tag;
var options = iElement.options;
if(options.length>1){
for(var j = options.length-1; j >= 0; j--){
tag = new Array();
optionObj=options[j];
tag["value"] = optionObj.value;
tag["text"] = optionObj.text;
optionTags[index++] = tag;
if(tag["value"] != elementValue){
iElement.remove(j);
}
}
}
iElement.optionTags = optionTags;
//iElement.className="readonly";
}
} function setCheckBoxReadonly(field,flag)
{
if(flag==true)
{
if(field.setCheckBoxReadonlyFlag!=true)
{
field.setCheckBoxReadonlyFlag=true;
field.oldClassName = field.className;
field.oldOnclick = field.onclick;
field.className = "readonlycheckbox";
field.onclick = functionReturnFalse;
}
}
else
{
if(field.setCheckBoxReadonlyFlag==true)
{
field.className = field.oldClassName;
field.onclick = field.oldOnclick;
field.setCheckBoxReadonlyFlag = false;
}
}
} function setRadioReadonly(field,flag)
{
if(flag==true)
{
if(field.setRadioReadonlyFlag!=true)
{
field.oldClassName = field.className;
field.oldOnfocus = field.onfocus;
field.className = "readonlyradio";
field.onfocus = functionCancelFocus;
field.disabled = true;
}
}
else
{
if(field.setRadioReadonlyFlag==true)
{
field.className = field.oldClassName;
field.onfocus = field.oldOnfocus;
field.setRadioReadonlyFlag = false;
field.disabled = false;
}
}
}
</script>
【JavaScript】Js控制页面所有元素只读的更多相关文章
- js控制页面的全屏展示和退出全屏显示
<!DOCTYPE html> <html> <meta http-equiv="Content-Type" content="text/h ...
- js 控制页面跳转的5种方法
js 控制页面跳转的5种方法 编程式导航: 点击跳转路由,称编程式导航,用js编写代码跳转. History是bom中的 History.back是回退一页 Histiory.go(1)前进一页 Hi ...
- Jsp页面跳转和js控制页面跳转的几种方法
Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servle ...
- 利用来JS控制页面控件显示和隐藏有两种方法
利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 document.getEle ...
- JS控制页面内容
JS操作页面内容 innerText:普通标签内容(自身文本与所有子标签文本)innerHTML:包含标签在内的内容(自身文本及子标签的所有)value:表单标签的内容outerHTML:包含自身标签 ...
- js控制页面显示和表单提交
早期的web页面在显示方面一般在后台进行控制,虽然对后台开发来讲是比较容易做到的,但是涉及到一个问题,那就是数据库压力. 因为要控制显示,所以会比较频繁的从数据库中来回调用. 现在的js功能越来越强, ...
- js控制页面显示
两个菜单切换显示页面内容: js控制代码, /** JS初始化 **/ $(document).ready(function() { $('#email_btn').click(function(){ ...
- js控制页面跳转,清缓存,强制刷新页面
单看标题,必定满脸蒙13. 其实,想表达的仅仅是,在js中通过window.location.href控制页面跳转时,有时会跳转至缓存页面,并没有真正去请求要跳转的地址,导致页面数据未能及时加载刷新. ...
- javascript 获取父页面中元素对象方法
父页面中: <input type="hidden" id="areaID" value="test1"> <iframe ...
随机推荐
- 使用Vue-resource完成交互
使用vue-resource 引入vue-resource vue-resource就像jQuery里的$.ajax,是用来跟后端交互数据的,vue-resource是vue的一个插件,所以我们在开始 ...
- 小程序开发教程:wx.setTopBarText(OBJECT)
状态信息展示 当小程序被显示在聊天顶部时,开发者可将重要的状态变更信息实时展示出来,便于用户及时获知. 详见文档:小程序文档 小程序更新之后,有个更有用的功能!支持状态栏实时状态更新!! wx.set ...
- xdu_1048:二分匹配模板测试
二分匹配的模板题,这里用网络流模板(见刘汝佳<算法竞赛入门经典·训练指南>P359 Dinic算法)做. 将男女生均看做网络上的节点,题中给出的每个"关系"看做一条起点 ...
- STS 配置tomcat以后,无法访问
问题 今天在新环境下安装开发环境STS,使用的的3.9,如下图 安装完成之后配置Tomcat,在STS启动Tocat后,在浏览器输入:http://localhost:8080/ 发现无法访问... ...
- spring 的单例模式
singleton---单例模式 单例模式,在spring 中其实是scope(作用范围)参数的缺省设定值每个bean定义只生成一个对象实例,每次getBean请求获得的都是此实例 单例模式分为饿汉模 ...
- 【RequireJS】requireJS的基础知识
1. requirejs的优点 1)异步加载依赖的文件 2)管理文件加载顺序 3)管理文件加载的包路径 2. requirejs下载地点 https://github.com/jrburke/requ ...
- zabbix 配置发送邮件报警
标签:监控/SQLServer/Windows 概述 本篇文章主要介绍如何配置zabbix借助外部邮件进行发送邮件报警,zabbix通过配置文件调用mailx来进行邮件的发送.在Centos6以上的版 ...
- css层叠样式表
css的三种声明方式 1.行内样式 通过每个标签都有的style属性 <div style="color:red;">黄卫星说没有内容 ...
- 微服务(二)hystrix
特性 1.延迟和失败容忍 防止级联错误,错误回退,优雅降级.快速失败和恢复 线程和信号量隔离 2.实时监控和配置更改 3.并发 并行执行,请求缓存,自动批处理失败请求 总运行流程 当你发出请求后,hy ...
- 6.linux下部署 web 项目
安装java 1.下载 linux 环境的jdk 2.上传该压缩包到 linux 系统中并且解压 tar -zxvf 压缩包名 3.配置环境变量并且刷新配置 export JAVA_HOME=/ali ...