JS控件替换,将 input、textarea、Select等控件替换成 span

 

最近项目中要将输入控件转换成 SPAN或DIV,因此专门写了这么一个方法,现在共享给大家,如果有更好的建议还请大家指教。

 

ContractedBlock.gif ExpandedBlockStart.gif Code


ExpandedBlockStart.gifContractedBlock.gif 
/**//*
  功能:过滤HTML控件,将输入控件替换成SPAN
  Author: Kim
  DateTime: 2008-12-29
  参数说明:elements 要删除的控件数组;
 
*/

 
function RemoveControl(elements)
ExpandedBlockStart.gifContractedBlock.gif 
{
  
var arrObj = new Array();
  
  
var count = elements.length;
  
for(var i=0;i<count;i++)
ExpandedSubBlockStart.gifContractedSubBlock.gif  
{
   
if(elements[i] == undefined)
    
continue;
    
   
var obj = document.createElement('span');
   
switch(elements[i].type)
ExpandedSubBlockStart.gifContractedSubBlock.gif   
{
    
case "text" : 
      obj.setAttribute(
"innerHTML",elements[i].value);
      
break;
    
case "textarea" :
      obj.setAttribute(
"innerHTML",elements[i].innerHTML);
      elements[i].innerHTML 
= '';
      
break;
    
case "select-one" :
      
for(var j=0;j<elements[i].length;j++)
ExpandedSubBlockStart.gifContractedSubBlock.gif      
{
       
if(elements[i][j].selected)
ExpandedSubBlockStart.gifContractedSubBlock.gif       
{
        obj.setAttribute(
"innerHTML",elements[i][j].text);
        
break;
       }

      }

      elements[i].options.length 
= 0;
      
break;      
   }

   elements[i].parentNode.appendChild(obj);
   arrObj[arrObj.length] 
= elements[i];
  }

  
  
//删除表单原控件
  for(var i=0;i<arrObj.length;i++)
ExpandedSubBlockStart.gifContractedSubBlock.gif  
{
   arrObj[i].removeNode();
  }

 }


 

 

ExpandedBlockStart.gifContractedBlock.gif 
/**//*
    调用事例
 
*/

function Filter()
ExpandedBlockStart.gifContractedBlock.gif 
{
  
//document.getElementById('tab_Forms').innerHTML = document.getElementById('tab_Forms').innerHTML.replace(/''/g,'');//  
ExpandedSubBlockStart.gifContractedSubBlock.gif
  /**//* input Filter */  
  
var elements = document.getElementById('tab_Forms').getElementsByTagName('input');
  RemoveControl(elements); 
  
ExpandedSubBlockStart.gifContractedSubBlock.gif  
/**//* TextArea Filter */ 
  elements 
= document.getElementById('tab_Forms').getElementsByTagName('textarea');
  RemoveControl(elements); 
  
ExpandedSubBlockStart.gifContractedSubBlock.gif  
/**//* select */
  elements 
= document.getElementById('tab_Forms').getElementsByTagName('select');
  RemoveControl(elements);   
  
  
//alert(document.getElementById('tab_Forms').innerHTML);  οnlοad="Filter();"               
 }


转载于:https://www.cnblogs.com/KimSky/archive/2008/12/29/1364821.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值