学习第十二
今天打好了一份慢慢的表单内容。
<script type="text/javascript"> var arr_province = ["请选择省/城市","北京市","上海市","天津市","重庆市","深圳市","广东省","河南省"]; var arr_city = [ ["请选择城市/地区"], ["东城区","西城区","朝阳区","宣武区","昌平区","大兴区","丰台区","海淀区"], ['宝山区','长宁区','丰贤区', '虹口区','黄浦区','青浦区','南汇区','徐汇区','卢湾区'], ['和平区', '河西区', '南开区', '河北区', '河东区', '红桥区', '塘古区', '开发区'], ['俞中区', '南岸区', '江北区', '沙坪坝区', '九龙坡区', '渝北区', '大渡口区', '北碚区'], ['福田区', '罗湖区', '盐田区', '宝安区', '龙岗区', '南山区', '深圳周边'], ['广州市','惠州市','汕头市','珠海市','佛山市','中山市','东莞市'], [''] ]; function=select_change(index) //实现选择功能 { var city = document.form1.city //定义一个city数组 city.length = 0; //定义初始值为0 city.length= arr_city[index].length; //附值 从0开始 for (var i=0; i<arr_city[index].length;i++) //循环增加+1个option { city options[i].text=arr_city[index][i]; city options[i].value=arr_city[index][i];//定义变量的位置 } } function init() //实现同步功能 { var province=document.form1.province; var city=document.form1.city; province.length=arr_province.length; for(var i=0 ; i<arr_province.length;i++) { province options[i].text=arr_province[index][i]; province options[i].value=arr_province[index][i]; } var index=0; //指定省份当前的默认选中索引号 province.selectedIndex=index; city.length=arr_city[index].length; for(var j=0; j<arr_city[index].length;j++) { city.options[j].text=arr_city[index][j]; city.options[j].value=arr_city[index][j]; } } </script> </head> <body onload="init()"> <form name="form1" id="form1" method="post" action="register.php" enctype="multipart/form-data"> <!--创建表格 方法选择post 行为是注册.php 增加一个表格--> <table wight="600"align="center" border="1" borderColor="#f0f0f0" cellpadding="5" style="border-collapse:collapse;"> <!-- 创建表单 collapse 折叠闭合 很细的表框--> <tr> <td colspan="2"><b>收费表</b></td> <!--colspan从第二个字开始--> </tr> <tr> <td align="right" width="100">用户:</td> <td><input type="text" name="username" size="30" placeholder="请输入你的名字"maxlength="20"/></td> <!--增加文本 value:属性值可显示--> </tr> <tr> <td align="right" >密码:</td> <td><input type="password" name="userpdw" size="30" placeholder="请再次输入你的密码" maxlength="20"/></td> </tr> <tr> <td align="right">重复密码:</td> <td><input type="password" name="repdw" size="30" placeholder="请再次输入你的密码" maxlength="20"/></td> </tr> <tr> <td align="right">真是姓名:</td> <td><input type="text" name="name" size="30"placeholder="请填写您的中文名字"/></td> </tr> <tr> <td align="right">性别:</td> <td> <input type="radio" name="sex" checked="checkde" value="先生"/>先生 <input type="radio" name="sex" value="女士"/>女士 <input type="radio" name="sex" value="gay"/>gay </td> <tr> <td align="right">付款方式:</td> <td> <input type="checkbox" name="hobby" checked="checked" value="微信支付"/>微信支付 <input type="checkbox" name="hobby" checked="checked" value="支付宝"/>支付宝支付 <input type="checkbox" name="hobby" checked="checked" value="支付宝"/>银联支付 <input type="checkbox" name="hobby" checked="checked" value="支付宝"/>信用卡支付 <input type="checkbox" name="hobby" value="支付宝"/>现金支付 </td> <tr> <td align="right">所在地</td> <td> <!--<select name="place"> <option value="" selected="selected">请选择所在地</option> <option value="" >泰国</option> <option value="" >日本</option> <option value="">中国</option> </select>--> <form name="form2"> 请选择所在地：<select name="province" onchange="select_change(this.selectedIndex)" style="width:130px;"></select><!--下拉列表--> 城市：<select name="city"></select> </form> </td> <tr> <td align="right">上传头像</td> <td><input type="file" name="uploadfile"/></td> </tr> <tr> <td align="right">个人信息</td> <td><textarea name="intro" cols="40" rows="5"> </textarea> </td> </tr> <tr> <td align="right"> </td> <td> <input type="submit" value="提交表格"/> <input type="reset" value="清空内容"/> <input type="button" value="提交表格" onclick="javascript:this.form.submit()"/> <input type="image" img src="jd1.png"/> </td> </tr> </table> </form> </body>
