JavaScript中取到form的值的方法 - Hello World - ITeye技术网站
博客分类：
如有以下代码：
&form action="get.do" method="post" id="fi" name="fn"&
username:&input type="text" id="username"/&&br/&
password:&input type="password" id="password"/&&br/&
&input type="submit" value="submit"&
可以通过以下三种方式（我所知道的）来取到值： var show = document.fn.elements['username'].//注意这里fn是form的名字，而不是id var show = document.getElementById('username'). var show = fi['username'].//fi是form的id号码
在百度悬赏20分拿到一个很不错的答案：
1、通过对象的位置来引用,如下：
var msg=document.forms[0].elements[0].
2、通过name属性访问文档对象：
var msg=document.myForm.myText. //设name="myForm"和="myText"
3、通过id属性访问文档对象：
var msg=document.getElementById('myText');
4、通过联合数组访问文档对象：
var msg=document.forms['myForm'].elements['myText']. //只支持火狐！
var msg=document.forms('myForm').elements('myText'). //只支持IE！
5、通过IE提供的item()方法访问文档对象：
var msg=document.forms.item("myText");
6、通过元素标签返回指定对像：
var msg=document.getElementsByTagName("tr"); //参数可以为'*',表示找所有的元素对象
7、多对象数组时可分步访问：
var myObj=document.
var msg=myObj[i].
8、访问对象的所有子对象：
for (i=0;i&example.childNodes.i++) //example为假设对象
msgs=example.childNodes.item(i).nodeN
for (i=0;i&example.childNodes.i++) //example为假设对象
msgs=example.childNodes[i].nodeN
window为浏览器窗口对象,为文档提供显示容器,即与浏览器相关,如窗口的大小和关闭窗口等属性及方法,属于最顶级对象...
document与上不同,即与当前载入的文档相关,包括当前浏览器窗口或框架区域中的所有内容,包含文本域,按钮...等HTML页面可访问元素.
element文档中的元素对象,是可见的,或者说是标签,不同于Node对象,这是我自已的理解,或许有不确切这处,请提出来,哈哈
论坛回复 /
(57 / 14905)
風一樣的男子 写道这帖子不是一般的水
首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。
首先，记笔记有博客。
其次，既然发帖就要有被喷的觉悟。
最后，这种问题搜一下一大把，多动脑，勤懂手。共勉...
bepatient 写道風一樣的男子 写道这帖子不是一般的水
首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。
。。。
我只是说帖子很水，你激动啥？怎么就牵扯素质问题了？
当然，再简单的问题也有人不知道
这很正常，但我说水我只是认为这个问题太简单
稍微会点JavaScript的人都知道
为什么就那么激动？动不动就要上纲上线？
楼主说话句句不离素质，但是鄙人眼挫，却没看出来楼主所说的素质在哪里。
風一樣的男子 写道这帖子不是一般的水
首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。
。。。
我只是说帖子很水，你激动啥？怎么就牵扯素质问题了？
当然，再简单的问题也有人不知道
这很正常，但我说水我只是认为这个问题太简单
稍微会点JavaScript的人都知道
为什么就那么激动？动不动就要上纲上线？
xzj127 写道JE 现在的帖子 不如以前了....
JE 不如以前了....
JE 人不如以前了....
bepatient 写道zhao103804 写道这样不就取到了吗
var show = document.fn.username.//
为什么要这样写呢
var show = document.fn.elements['username'].//
嗯，果然这种比较方便。谢了。
请教您一个问题：以上var show = document.fn.username.fn是name，username是id，这个怎么区别，怎么理解呢？这个id和name老师混淆了。请您赐教！
关于name和id的区别
id语法：
HTML &ELEMENT ID = sID... &&
Scripting ：object.id [ = sID ]
“The id should be unique throughout the scope of the current document. If a document contains more than one object with the same identifier, the objects are exposed as a collection that can be referenced only in ordinal position.”
name语法：
HTML &ELEMENT NAME = sName... &&
Scripting： object.name [ = sName ]
在摘要中没有上面加引号那一段
所以，上面的情况你用name和id效果都是一样的
在IE中，可以直接把name或者ID当做window的变量来引用，但是经常会出现ID和name混淆的情况
mp_juan 写道moses3017 写道xzj127 写道JE 现在的帖子 不如以前了....
JE 不如以前了....
赞同
同
赞同,应该说终于放下了高傲的姿态,开始向一般大众靠拢了
zhao103804 写道这样不就取到了吗
var show = document.fn.username.//
为什么要这样写呢
var show = document.fn.elements['username'].//
嗯，果然这种比较方便。谢了。
请教您一个问题：以上var show = document.fn.username.fn是name，username是id，这个怎么区别，怎么理解呢？这个id和name老师混淆了。请您赐教！
关于name和id的区别
id语法：
HTML &ELEMENT ID = sID... &&
Scripting ：object.id [ = sID ]
“The id should be unique throughout the scope of the current document. If a document contains more than one object with the same identifier, the objects are exposed as a collection that can be referenced only in ordinal position.”
name语法：
HTML &ELEMENT NAME = sName... &&
Scripting： object.name [ = sName ]
在摘要中没有上面加引号那一段
所以，上面的情况你用name和id效果都是一样的
& 上一页 1
浏览: 135911 次
来自: 杭州
值得学习，对我有帮助
对我太有帮助了。
兄弟，快一年了，加油。找到一篇比较全的js获取form表单值（前端薄弱的孩子多看看吧）
文章来源：.cn/s/blog_66d444d10100kotu.htmljquery如何取得text,areatext,radio,checkbox,select的值,以及其他一些操作;假如我们有如下页
文章来源：
jquery如何取得text,areatext,radio,checkbox,select的值,以及其他一些操作;假如我们有如下页面:
&&input type=&text& name=&textname& id=&text_id& value=&&&
& &...........在此不写出来了
下面来看怎么取得FORM中的各种值等等;
function get_form_value(){
& &var textval = $(&#text_id&).attr(&value&);//或者
& &var textval = $(&#text_id&).val();
& &var valradio = $(&input[@type=radio][@checked]&).val();
var checkboxval = $(&#checkbox_id&).attr(&value&)；
& &var selectval = $('#select_id').val();
//获取下拉列表选取中的值,此方法针对所有下拉框都起作用的
//此方法针对所有下拉框都起作用的
& &//如果针对某ID进行获取，$(‘#id&option’).each()即可
&$('select&option').each(function(){
& & if($(this).attr('selected')==true)
& & alert($(this).text());
3.另外对表单的其他处理:
//控制表单元素：
//文本框，，文本区域：
$(&#text_id&).attr(&value&,'');//清空内容
$(&#text_id&).attr(&value&,'test');//填充内容
//多选框checkbox：
$(&#chk_id&).attr(&checked&,'');//未选中的值
$(&#chk_id&).attr(&checked&,true);//选中的值
if($(&#chk_id&).attr('checked')==undefined) //判断是否已经选中
//单选组radio：
$(&input[@type=radio]&).attr(&checked&,'10');//设置value=10的单选按钮为当前选中项
//下拉框select：
$(&#select_id&).attr(&value&,'test');//设置value=test的项目为当前选中项
$(&&option value='test'&test&/option&&option value='test2'&test2&/option&&).appendTo(&#select_id&)//添加下拉框的option
$(&#select_id&).empty()；//清空下拉框
$( )选择器：
1。$('form :text,form :password') 选择form中type为text和password
2.$('form :text:not(#name,#nickname,#verify)') 选择form中type为text的并且不包括id为name，nickname，verify的
3.$('input[name=reg_ip]') & 选择name为reg_ip
4.$('form :input') &选择form中所有的input
var $target = event. 获取发生事件的事件源对象。 $target.id 获取这个对象的id值 event.preventDefault(); 取消事件的默认行为！ $(this).val()这样是取值 $(this).val(data)赋值 $targetParent.find(':last-child').is('span')查找最后一个元素是不是span $targetParent.find('span:last').remove();移除
。text（）只用于标签，仅取出显示的内容
。val（）只用于input
。html（）是把标签都取出来
你最喜欢的原生JS实现表单checkbook获取已选择的值_javascript_ThinkSAAS
原生JS实现表单checkbook获取已选择的值
原生JS实现表单checkbook获取已选择的值
内容来源： 网络
从一个表单checkbox获取到已选中的数据值： 复制代码 代码如下: &input type="checkbox" name="cb" value="1" /&aa &input type="checkbox" name="cb" value="2" /&bb &input type="checkbox" name="cb" value="3" /&cc &input type="checkbox" name="cb" value="4" /&dd &br/& &input type="button" value="提交" onclick="checkedValues()" /&
采用原生JS写法： 复制代码 代码如下: function checkedValues(){ var arr=new Array(); var checkbox=document.getElementByName(&cb&); for(var i=0;i&checkbox.length();i++){ if(checkbox[i].checked==true){ arr.push(checkbox[i].value); alert(checkbox[i].value); } } } 
PHP开发框架
开发工具/编程工具
服务器环境
ThinkSAAS商业授权：
ThinkSAAS为用户提供有偿个性定制开发服务
ThinkSAAS将为商业授权用户提供二次开发指导和技术支持
让ThinkSAAS更好，把建议拿来。
开发客服微信