zl程序教程

您现在的位置是:首页 >  前端

当前栏目

jquery中对表单的基本操作代码

jQuery代码 表单 基本操作
2023-06-13 09:14:23 时间
复制代码代码如下:

<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title></title>
<scriptsrc="../conn/jsfile/jquery.js"type="text/javascript"></script>
</head>
<body>
<formid="form1"runat="server">
文本框:<inputtype="text"id="txt"value="txt"/><br/>
单选按钮:<inputtype="radio"value="男"checked="checked"name="sex"/>男<inputtype="radio"value="女"name="sex"checked="checked"/>女<br/>
复选框:<inputtype="checkbox"value="1"name="cc"/>1<inputtype="checkbox"value="2"checked="checked"name="cc"/>2<inputtype="checkbox"value="3"checked="checked"name="cc"/>3<br/>
下拉框:
<selectid="sel"style="width:100px">
<optionvalue="yi">1</option>
<optionvalue="er"selected="selected">2</option>
<optionvalue="san">3</option>
</select>
<scriptlanguage="javascript"type="text/javascript">
/*------------------------------------------------javascript-------------------------------------------*/
/*获取文本框的值
alert(document.getElementById("txt").value);
*/
/*获取单选按钮的值
varradios=document.getElementsByName("sex");
varn=radios.length;
for(vari=0;i<n;i++){
if(radios[i].checked){
alert(radios[i].value);
}
}
*/
/*获取复选框中选中的值的组合1,2,3,4
varcheckboxs=document.getElementsByName("cc");
varn=checkboxs.length;
for(vari=0;i<n;i++){
if(checkboxs[i].checked){
alert(checkboxs[i].value);
}
}
*/
/*获取下拉列表的选中项的值
方法一:
alert(document.getElementById("sel").value);
方法二:
varsel=document.getElementById("sel");
alert(sel.options[sel.selectedIndex].value);
*/
/*------------------------------------------------jquery-------------------------------------------*/
/*获取文本框的值
alert($("#txt").val());
*/
/*获取单选框选中项的值
alert($(":radio[name="sex"]:checked").val());
单选框赋值设置选中项
$(":radio[name="sex"]").val(["男"]);
*/
/*获取复选框的值
$(":checkbox[name="cc"]:checked").each(function(i){
alert(this.value);
});
复选框赋值选中这几项
$(":checkbox[name="cc"]").val(["1","2","3"]);
*/
/*获取下拉列表的值
alert($("#sel").val());
获取下拉列表的文本
alert($("#seloption:selected").text());
*/
</script>
</form>
</body>
</html>