表单笔记

最新推荐文章于 2025-04-22 01:05:44 发布

原创最新推荐文章于 2025-04-22 01:05:44 发布 · 571 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#input #function #javascript #c

JavaScript 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了HTML表单的基本使用，包括input元素的defaultValue属性、select元素的选择操作以及如何通过JavaScript获取并处理表单数据。

//input 框中的  defaultValue 指 输入内容

 //select 将input框中的内容全部选中

<input  type="text" name="textInput" value="输入内容"  />


<script language="javascript"> 
window.onload = function() { 
var fm = document.getElementById('fm1'); //通过ID获取
form var t = fm.textInput; //通过name 获取 
fm.getElementsByTagName('input');//获取所有的fm节点下面的input
var eles = fm.elements; //获取fm下面所有的表格元素
fm.onsubmit = function() {  
var select = this.city;  //option的下标  
alert(select.selectedIndex);  //获取所有option  
var options = select.getElementsByTagName('option');  
alert(options[select.selectedIndex].innerHTML);  
//获取option的键值与VALUE  
alert("城市ID:"+select.options[select.selectedIndex].value+"\n城市名称:"+select.options[select.selectedIndex].text);      
return false;    
};
};
</script>

 <h1>表单</h1>
 <form name="fm1" id="fm1" >
  <input type="submit" value="提交" />
 <input type="text" name="textInput" value="输入内容" /> 
 <select name="city">
   <option value="A1">北京</option>
   <option selected="selected" value="B1">上海</option>
   <option value="C1">苏州</option>
  </select>
  <label>Label</label>
 </form>