文本相关对象:就是每个与文本相关的HTML元素(文本,密码,隐藏域,文本域等)这些东东其实只有两个属性被重视(确切说是被我重视)onchenge和value,前者调用函数,后者求、赋值,在AJAX&javascript入门系列这之前的实例中已经用了很多次了,这里就简单演示一个了!

演示一 : 在另外文本域显示密码(在前面密码框输入你的银行密码)

前面输入的是


按钮对象:没什么说的,看下演示咯,其实按钮用得最多的还是 onclick

演示二:改变按钮上的文字以及状态


复选框对象:,这里大概说下,复选框的value是个很特殊的东西,他不可见,但是相对脚本来说却非常重要,复选框最重要的一个属性当然还是选中与否的 checked 这个属性返回Boolean值!

演示三 :没啥子说的,你选下下面这个复选框再取消选择就知道了


单选按纽对象:单选按纽有个毛病,要使他们在一组,就必须给他们相同的名字,当你使用同名字制定了一组按钮后,页面载入后也会将同名字的一组元素作为一个数
组处理,这样以来,我们就可以使用 document.formname.groupname.length 的方式得出该组有多少元素,同理,可以使用 document.formname.groupname[index].checked 来判断当前元素是否被选中 。

演示四:显示两组按钮中都分别显示选择了什么

第一组 第二组
大甜甜
小甜甜
老甜甜
老不死
打不死
小不死
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascriptjavascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_复选框_02<%javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<html xmlns="http://www.w3.org/1999/xhtml">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<head>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<title>表单和表单元素(文本相关,按钮,单、复选按钮)</title>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascriptjavascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_复选框_02<script language="javascript">javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12function txt()
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{//改变文本框的值
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    document.getElementById("txt").value=document.getElementById("pwd").value;
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17}
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12function subm()
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{//改变按钮上的字
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    document.all.submm.value="你按过我了";//该行使用了一种比较老的查找控件的方法
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    document.getElementById("submm").disabled=true;//将按钮设置为可见不可用状态
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17}
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12function chk()
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    var chhkk=document.all.chkname;//将复选框对象赋给变量chhkk,方便以后的多次引用
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14    if(chhkk.checked)javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{//如果被选中了
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12        alert("感谢选举"+ chhkk.value )//弹出提醒对话框,包含复选框的值
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17    }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14    elsejavascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12        alert("你有本事,敢不选"+ chhkk.value)
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17    }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17}
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12function vote()
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    var form=document.rad;
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14    for(var i=0;i<form.onerad.length;i++)javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14        if(form.onerad[i].checked)javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{            
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12            break
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17        }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17    }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14    for(var j=0;j<form.tworad.length;j++)javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_html_13javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_单选_14        if(form.tworad[j].checked)javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_03{
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12            break;
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17        }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_17    }
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_12    alert(form.onerad[i].value +"vs"+ form.tworad[j].value)
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_javascript_67}
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</script>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</head>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<body>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>文本相关对象</strong>:就是每个与文本相关的HTML元素(文本,密码,隐藏域,文本域等)
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04这些东东其实只有两个属性被重视(确切说是被我重视)onchenge和value,前者调用函数,后者求、赋值,在<strong><a href='javascript:void(0)'>AJAX&amp;javascript入门系列</a></strong>这之前的实例中已经用了很多次了,这里就简单演示一个了!</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>演示一 : 在另外文本域显示密码</strong>(在前面密码框输入你的银行密码)</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <input type="password" name="pwd" onchange="txt()" />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  前面输入的是
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <textarea name="txt"></textarea>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<hr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>按钮对象</strong>:没什么说的,看下演示咯,其实按钮用得最多的还是 onclick </p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>演示二:改变按钮上的文字以及状态</strong></p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <input type="submit" name="submm" value="提交" onclick="subm()" />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</strong></p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<hr />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>复选框对象</strong>:,这里大概说下,复选框的value是个很特殊的东西,他不可见,但是相对脚本来说却非常重要,复选框最重要的一个属性当然还是选中与否的 checked 这个属性返回Boolean值!</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>演示三 :没啥子说的,你选下下面这个复选框再取消选择就知道了</strong></p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <input type="checkbox" name="chkname" value="天轰穿" onclick="chk()" />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<hr />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>单选按纽对象</strong>:单选按纽有个毛病,要使他们在一组,就必须给他们相同的名字,当你使用同名字制定了一组按钮后,页面载入后也会将同名字的一组元素作为一个数<br />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04组处理,这样以来,我们就可以使用 <strong>document.formname.groupname.length</strong> 的方式得出该组有多少元素,同理,可以使用 <strong>document.formname.groupname[index].checked</strong> 来判断当前元素是否被选中 。</p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<p><strong>演示四:显示两组按钮中都分别显示选择了什么 </strong></p>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<form name="rad" onsubmit="return false">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<table width="400" border="0" cellspacing="0" cellpadding="5">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    <td align="center" bgcolor="#CDCDCD">第一组</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    <td align="center">第二组</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    <td bgcolor="#CDCDCD"><table width="200" border="0" cellspacing="0" cellpadding="5">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td width="73">大甜甜</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td width="107"><input type="radio" name="onerad" value="大甜甜" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td>小甜甜</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td><input type="radio" name="onerad" value="小甜甜" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td>老甜甜</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td><input type="radio" name="onerad" value="老甜甜" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    </table></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    <td><table width="200" border="0" cellspacing="0" cellpadding="5">
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td width="67">老不死</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td width="113"><input type="radio" name="tworad" value="老不死" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td>打不死</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td><input type="radio" name="tworad" value="打不死" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td>小不死</td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04        <td><input type="radio" name="tworad" value="小不死" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04      </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    </table></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  <tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04    <td colspan="2" align="center"><input type="submit" name="Submit" value="提交" onclick="vote()" /></td>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04  </tr>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</table>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04<hr />
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</form>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</body>
javascript入门·表单和表单元素二 (文本相关,按钮,单、复选按钮)_文本域_04</html>
网站计数器