我的漫漫程序之旅

专注于JavaWeb开发
随笔 - 39, 文章 - 310, 评论 - 411, 引用 - 0
数据加载中……

Javascript动态创建控件

 

<html>

<head>

<title></title>
<script language="javascript" type="text/javascript">
function createElement(tagName, type)
{
   
var element = null;
   
try
   
{
      element 
= document.createElement('<+ tagName + ' name="'+name+'" />');
      element.type 
= type;
      element.value 
= value;
   }

   
catch (e)
   
{
   }

   
if ( ! element)
   
{
      element 
= document.createElement(tagName);
      element.setAttribute(
"type", type);
   }

   
return element;
}



function add()
{
    
var input1 = createElement("input","file");
    
var br = document.createElement("<br />");
    
var files = document.getElementById("files");
    files.appendChild(br);
    files.appendChild(input1);
}

</script>
</head>

<body>
<input type="button" value="add" onclick="add();"/>
<div id="files">
<input type="file"/>
</div>
</body>

</html>

延伸一下,动态创建input任意元素代码片段如下即可:
function createElement(tagName,name,type,value)
{
    
var element = null;
    
try 
    
{
        element 
= document.createElement('<'+tagName+' name="'+name+'" />');
        element.type 
= type;
        element.value 
= value;
    }

    
catch (e)
    
{
    }

    
if (!element)
    
{
        element 
= document.createElement(tagName);
        element.setAttribute(
"type",type);
        element.setAttribute(
"name",name);
        element.setAttribute(
"value",value);
   }

   
return element;
}
 


posted on 2008-01-31 16:07 々上善若水々 阅读(2605) 评论(0)  编辑  收藏 所属分类: JavaScript


只有注册用户登录后才能发表评论。


网站导航: