`

项目开发中常用JS表单取值方法

阅读更多

一.常用表单基本取值方法(form1为表单名称,TextBox1为控件ID,以文本框为例,html控件与web服务器控件是一样的)
         1.form1.TextBox1.value
         2.var txt = document.all.TextBox1;
           txt.value
         3.var txt = document.all["TextBox1"];
           txt.value
         4.document.getElementById("TextBox1");

二.
1.html复选框(name相同)
表单: <input id="Checkbox1" type="checkbox" name="chk" value="123" />sss
        <input id="Checkbox2" type="checkbox" name="chk" value="456"/>aaa
        <input id="Checkbox3" type="checkbox" name="chk" value="789"/>bbb

实现功能:遍历html复选框,得到所选中项
    var oChks = document.all.chk;
    for(var i=0; i<oChks.length; i++)   
    {   
         if(oChks[i].checked)   
     alert(oChks[i].value);   
    }

2.html单选框(name相同)
表单: <input id="Radio1" type="radio" name="rad" value="123"/>123
        <input id="Radio2" type="radio" name="rad" value="456"/>456
实现功能:遍历html复选框,得到所选中项
代码同html复选框

3.html下拉列表框
表单:<select id="Select1" multiple>
     <option value=1>1</option>
     <option value=2>2</option>
       </select>
实现功能:
    3.1得到所选中项的text和value值(选择一项)
     var selDrp = document.all.Select1;
     alert(selDrp.options[selDrp.selectedIndex].text);
     alert(selDrp.options[selDrp.selectedIndex].value);
    3.2得到所选中项的text和value值(选择多项)
     for(var j=0;j<selDrp.options.length;j++)
     {
           if(selDrp.options[j].selected)
           {
      alert(selDrp.options[j].value);
           }
     }
4.DropDownList控件与ListBox控件
实现功能:得到所选中项的text和value值
代码同html下拉列表框

5.CheckBoxList控件
实现功能:得到所选中项的text
代码:
         var chklist = document.all("CheckBoxList1");
         var i = 0;   
         for(i=0;i<chklist.rows.length;i++)   
         {   
    var name = "CheckBoxList1_" + i;   
    var tmpChecked = document.all[name].checked;
                 if(tmpChecked)   
                 {   
     alert(document.all[name].parentElement.innerText);   
                   
                  }   
        }

分享到:
评论

相关推荐

    jquery 表单取值常用代码

    以下是介绍jQuery表单取值和常用操作的知识点: 1. 获取和设置select元素的值 - 使用.val()方法可以获取select元素当前选中的值。 - 如果要设置select元素的值,可以将所需的value参数传递给.val()方法。如果...

    Js操作Select大全(取值、设置选中等等)

    JavaScript(简称JS)是网页开发中不可或缺的一部分,尤其在处理用户界面交互方面具有重要作用。本文档将详细介绍如何利用原生JavaScript和jQuery来操作`&lt;select&gt;`元素,包括但不限于取值、设置选中状态等常见操作。...

    dwr utils.js常用方法整理

    在深入探讨DWR中Util.js的常用方法之前,我们先简要回顾一下DWR(Direct Web Remoting)是什么。DWR是一种开源框架,允许在Java服务器端与客户端之间进行Ajax调用,使得JavaScript可以直接调用服务器端的Java方法,...

    table中checkbox取值

    在网页设计和开发中,表格(Table)是展示数据常用的一种布局方式,而复选框(Checkbox)则是用户交互的重要元素之一。当我们需要在表格中使用复选框时,往往需要处理它们的值,比如选中状态的获取、传递或者存储。...

    JSValidation-----强大而灵活的表单客户端验证框架

    并创造性的采用xml来存贮表单验证信息,使得表单的验证成为整个项目中最不重要的环节,开发者只需要定义几个xml标记,就可以创建出复杂的验证策略,而不用编写一行JavaScript代码。由于采用xml集中管理表单验证,...

    JQueryEasyUI框架下的combobox的取值和绑定的方法

    在实际项目开发中,JQueryEasyUI框架被广泛应用于快速开发动态的、交互式的Web应用程序,提供了一些常用的控件如combobox(下拉组合框)。 在JQueryEasyUI框架中,combobox组件允许用户从下拉菜单中选择一项或者多...

    Jquery中val()表单取值赋值的实例代码

    在使用JQuery进行前端开发时,val()方法是一个非常基础且常用的功能,它主要用来获取或设置表单元素的值。本知识点将详细介绍JQuery中val()方法的基本使用方法,包括如何对单个和多个元素进行操作,以及如何处理单选...

    jQuery常用方法

    以上只是jQuery常用方法的一部分,实际使用中,jQuery还有许多其他功能,如插件系统、DOM操作、效果和工具方法等,都极大地提升了JavaScript开发的效率和体验。在学习和实践中,你可以根据需求深入探索jQuery的更多...

    整理JavaScript对DOM中各种类型的元素的常用操作

    JavaScript对DOM(Document Object Model)的操作是Web开发中不可或缺的一部分,它允许我们动态地修改、添加和删除HTML或XML文档的结构和内容。DOM将网页结构解析为一系列可操作的节点,这些节点包括元素、属性、...

    将name值一样的input值拼接起来

    在网页开发中,我们...在提供的"【压缩包子文件的文件名称列表】: name值一样的form表单取值.html"中,应该包含了一个示例代码,你可以查看和学习这个例子以加深理解。通过实践和应用,你将能够熟练地处理这种情况。

    js的一些常用方法小结

    本文将总结一些在实际工作中常用的JavaScript方法,帮助开发者更好地理解和应用。 1. **Val()**:`val()` 方法用于获取或设置表单元素的值。在取值时,它返回指定元素(如`&lt;input&gt;`或`&lt;textarea&gt;`)的当前值;在...

    js获取复选框选中项的值

    在探讨如何使用JavaScript(简称JS)来获取复选框(checkbox)选中项的值之前,我们首先需要理解复选框的基本概念以及它在网页表单中的作用。复选框是一种常用的HTML元素,用于允许用户从多个选项中选择一个或多个...

    jquery常用标签详解.pdf

    在"jQuery常用标签详解.pdf"中,主要讲解了jQuery的一些核心功能,包括选择网页元素、操作结果集、链式操作、元素操作、事件处理以及特殊效果等。 一、选择网页元素 jQuery提供了丰富的选择器来选取网页中的元素。...

    jQuery操作复选框(CheckBox)的取值赋值实现代码

    在Web开发中,复选框(Checkbox)是常用的表单元素之一,用于实现多选功能。jQuery作为一个广泛使用的JavaScript库,提供了简单有效的方法来操作HTML元素,包括复选框。本文将详细解释如何使用jQuery来获取和设置复...

    web前端研发工程师笔试题(选择题带答案)

    本文将详细解析Web前端研发工程师笔试题中的选择题,涵盖JavaScript、HTML、DOM操作等多个知识点。 1. 动态改变层中内容可以使用的方法有`innerHTML`和`...理解并掌握这些知识点将有助于提升在实际项目中的开发能力。

    2019自己整理的前端工程师面试题题及答案(全面综合).doc

    * hidden 不是 display 属性的常用取值,而是 visibility 属性的常用取值。 7. 有关pixelTop 属性与 top 属性的说法正确的是。(D ) * 以上都不对,pixelTop 和 top 属性都是样式属性,用于设置元素的位置。 8....

    微信小程序实现传参数的几种方法示例

    在微信小程序开发中,传递参数是一项基础且重要的任务。本文将详细介绍四种常见的微信小程序实现传参数的方法:navigator组件跳转时传参、使用全局变量...在实际开发中,还需要根据项目需求和业务逻辑选择合适的方法。

    php程序员面试题(含html、JavaScript、php和mysql)

    **解析:**该语句调用了名为 `formName` 的表单的 `submit` 方法,用于提交表单数据。 #### 表单事件 **问题:**把鼠标移到文本框时,文本框中的内容自动全选。 **解析:**可以使用 `onfocus` 或 `onmouseover` ...

    前端练习题 代码敲烂月薪过万前端练习题 代码敲烂月薪过万.docx

    JavaScript中的setInterval方法用于设置定时任务,按指定时间间隔重复执行某段代码。 4. JavaScript中的关键字或保留字有哪些? 正确答案:C,link不是JavaScript的关键字或保留字。 JavaScript的关键字包括var...

    aspx中checkboxList扩展

    在ASP.NET Web Forms开发中,CheckboxList控件是一种常用的选择多选项的用户界面元素。它允许用户从一组可选的复选框中选择一个或多个选项。然而,原生的CheckboxList控件功能有限,有时可能无法满足复杂的业务需求...

Global site tag (gtag.js) - Google Analytics