JavaScript DOM 学习第五章表单简介(javascript的dom)

编辑：rootadmin

因为每一个表单的检测项都不同，所以我也不能给你一个万能的代码。你需要用我在这一章介绍的这些元素构建自己的检测函数。我在后面一张还有一个例子，你也可以参考。

在这一章我会首先讨论一下用JavaScript来检测表单的局限性，然后会解释一下提交时间处理程序，然后是表单本身的一些方法和属性。最后就是如何访问表单元素。

这里还有一篇Jeff Howden的介绍表单的使用错误和解决办法。Forms & JavaScript Living Together in Harmony局限性首先，你需要了解当用户提交了表单之后JavaScript的检测代码会做什么： 1、JavaScript检测表单时可能会像下面这样。如果代码发现了一个错误，那么提交就会暂停，然后给用户一个警告让他输入正确的数据。 2、如果没有什么错误或者JavaScript是关闭的那么表单内容就发送到服务器端。 3、如果服务器端的脚本发现了错误，就会返回一些错误信息。在这种情形下，用户需要返回表单然后重新填写数据再次提交。 4、如果没有错误发生，那么服务器端完成必要的工作并显示感谢信息。就像你所看到的，数据在提交过程中会检测两次：一次是JavaScript一次是服务端。服务端检测总是可行的，而且是可靠的。JavaScript的检测只有在用户开启JavaScript功能的时候才有用，那么既然服务端总是可靠有效，并且与用户使用的浏览器无关，那么为什么还需要JavaScript检测呢？ JavaScript检测是服务器端检测的一个有效补充，因为他能在数据发往服务器端的时候先检测一遍。这样用户就不用使用后退按钮回去修改表单内容，那样会很麻烦，而且在寻找填错的内容也是一件相当麻烦的事情。所以JavaScript检测比服务器端检测对用户的使用体验帮助更大。所以JavaScript不是一个完全的检测机制，但是作为服务器端的补充和对用户的友好性来讲还是一个不错选择。所以我建议使用这两种检测机制，既满足了用户的使用体验要求又保证了程序的安全性。 onsubmit 当你使用JavaScript来检测表单的时候，第一个事情就是创建onsubmit的事件处理程序。这个程序会在用户提交表单的时候运行。这个程序会检测某些字段是否有值填写，那些复选框是否选择了至少一个，或者其他的你需要检测内容。代码如下： checkscript()就是这个程序的名字。这段代码需要返回true或者false。如果返回的是false，那么表单就不会被提交，不论返回true还是false代码都会停止运行。所以生成的代码如下：当然这段代码可以写的很复杂，如果你需要检测很多表单项目或者一大堆的单选框。基本思想就是这样了：你遍历表单里的每一个需要检查的元素，如果发现了错误就返回false，然后代码停止运行，表单也不会被提交。当你发现了错误的时候，你应该提醒用户。可以用一个警告框，不过今天大多数的办法是生成一条错误信息然后添加在错误条目的后面。只有在最后地方，你检查过了所有的元素并且没有发现错误，那么你就返回true，表单就会被提交。表单的方法和属性 JavaScript对于处理表单还有一些内建的方法和属性。其中三个比较重要：你可以用submit()方法来提交表单。提交页面的第一个表单你可以写：其中text就是文本框或者textarea或者隐藏字段的name。value属性就会给出这些元素的文本，然后存储在user_input里。直接写也可以： Select Boxes 这也很简单：要更改他的选择项目，就必须修改selectedIndex，比如：现在第三个选项就被选择了。旧的浏览器在旧的浏览器里面select boxes没有value属性，那么：首先找出用户选择了的项目。document.forms[0].select.selectedIndex给出了选择项目的编号。JavaScript已经创建了一个包含所有select boxes选项的options数组。所以通过这个数组就能知道用户选择了什么，然后存储在user_input里面。 checkboxes checkboxes有一些小小的不同。我们已经知道了他的值，但是需要知道用户是否选择了他。checked属性可以告诉我们。他有true和false两个值。那么： checkbox是复选框的名字。如果复选框被选择了，我们就得到名字（你也可以选择得到值）然后传递给user_input。选择一个复选框可以：单选框不幸的是，你不能一下子就找到哪个单选框被选中了。只能在遍历之后查找checked属性为true的那一项。 radios就是这一组单选框的名字。注意document.forms[0].radios是包含所有单选框的数组，循环检测是否checked的属性为true。如果是则传递个user_input。 document.forms[0].radios.length返回所有单选框的数目。如果选择一个单选框，我们可以设置它的checked的值为true：翻译地址：转载请保留以下信息作者：北玉(tw:@rehawk)

推荐整理分享JavaScript DOM 学习第五章表单简介(javascript的dom)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:js dom方法,javascript中的dom,js中dom的用法,js domcontentloaded,javascript中dom的含义,js中dom的用法,js中dom的用法,javascript中dom的含义,内容如对您有帮助，希望把文章链接给更多的朋友！

JavaScript DOM学习第六章表单实例表单实例这是一个表单的实力。这里有一个小问题：因为我的服务器现在不支持，所以表单不能提交。我会打印出你的输入，然后返回一个false，这样表

JavaScript DOM 学习第七章表单的扩展想法假设你有一个在线的CD评级工具。你希望用户查看他们喜欢的所有CD。但是你怎么知道用户平均会查看多少张呢？你在这个页面上需要添加多少字段

JavaScript DOM学习第八章表单错误提示在我看来，警告框只用在浏览器不支持其他显示错误信息的办法的时候。W3C建议我们在表单项的附近显示错误信息。这是一种很好的办法，所以我们只

JavaScript DOM 学习第五章 表单简介(javascript的dom)

JavaScript DOM 学习第五章表单简介(javascript的dom)