<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns= "http://www.w3.org/1999/xhtml" > <head> <meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" /> <title> javascript 动态创建 input 文本框</title> <style type= "text/css" > <!-- body { font :12px “ Microsoft Sans Serif” ;}.TextStyle{ width :300px ; height :16px ; line-height :16px ; border :1px solid #006699 ; font :12px "Microsoft Sans Serif" ; padding :2px ; color :#006699 ;}-- ></style> <script type= "text/javascript" > //创建 input 文本框 function CreateInput(){ var input = document.createElement("input" ); input.type = "text" ; input.id = "inputText" ;input.className = "TestStyle";
input.placeholder="请填写项目名称"; input.myholder = "请填写项目名称"; //input.onfocus = "this.value=''"; //input.onblur = "if(this.value=''){this.value='请填写项目名称'}"; /*input.style.width = "300px"; input.style.height = "16px"; input.style.lineHeight = "16px"; input.style.border = "1px solid #006699"; input.style.font = "12px 'Microsoft Sans Serif'"; input.style.padding = "2px"; input.style.color = "#006699";*/ document.getElementById("showText" ).appendChild(input); } function GetClassName(){ var strValue = []; $(".TextStyle").each(function () { var value = $(this).val(); strValue.push(value); }) alert(strValue); }</script></head>
<body >
<div id= "showText" ></div> <input type= "button" οnclick= "CreateInput()" value= "动态生成input" /> <br /><br /> <input type= "button" οnclick= "GetClassName()" value= "获取创建文本框的值" /> </body> </html>