精华内容
下载资源
问答
  • 今天在代码中不小心写了两个name相同的form表单,然后通过document.forms[formName]形式获取到的只有第一个表单,然后深入学习了下document.forms[formName]和document.formName的区别和兼容性。 下面先测试了下...

    今天在代码中不小心写了两个name相同的form表单,然后通过document.forms[formName]形式获取到的只有第一个表单,然后深入学习了下document.forms[formName]和document.formName的区别和兼容性。

    下面先测试了下document.forms[formName]、document.forms.formName、document.formName、document.forms(formName)的兼容性
    一、当表单name唯一时

    <form action="test1" name="test">test1</form>
    

    IE8下
    IE8下
    IE9下
    IE9下
    firefox下,版本63.0.1
    firefox下,版本63.0.1
    chrome下,版本68.0.3340.75
    chrome下,版本68.0.3340.75
    safari下,版本11.1.2
    safari下,版本11.1.2

    测试发现:当表单name唯一时,在IE8版本,获取表单的所有方法得到的是一个object对象,通过这个object无法获取表单,而在firefox、chrome和safari下,不支持document.forms(formName)的形式获取表单

    二、当表单name不唯一时

    <form action="test1" name="test">test1</form> 
    <form action="test2" name="test">test2</form>
    

    IE8下
    IE8下
    IE8下,获取获取第二个表单
    IE8下,获取获取第二个表单
    IE9下
    IE9下
    IE9下,获取第二个表单
    IE9下,获取第二个表单
    firefox下
    firefox下
    firefox下,获取第二个表单
    firefox下,获取第二个表单
    chrome下
    chrome下
    chrome下,获取第二个表单
    chrome下,获取第二个表单
    safari下
    safari下
    safari下,获取第一个表单
    safari下,获取第一个表单

    测试发现:当表单name不唯一时,IE9下四种方式都返回了一个HTMLCollection对象,通过HTMLCollection[1]的形式可以获取到第二个表单;在firefox、chrome和safari下,通过document.forms[formName]和document.forms.formName获取到的都是第一个表单,而不是一个HTMLCollection对象,也就是说,通过这两种方法是无法获取到第i(i>1)个表单元素到;在document.formName方法则无论是在IE9、firefox、chrome还是safari下,都能获取一个HTMLCollection对象,也就是说,可以通过这种方法,获取到name相同的所有表单。
    结论:

    通过以上兼容性的测试,在不考虑IE8的情况下,推荐使用document.formName的形式获取表单。
    当表单name唯一时,通过document.formName的方法可获得该表单;
    当表单name不唯一时,通过document.formName的方法可以获得一个HTMLCollection对象,通过HTMLCollection[i]的形式,可以获得第i个表单。

    document.formName.length结果是什么?

    现在请思考下document.formName.length的结果是什么?是不是理所当然的想,当name唯一时,返回1;当name不唯一时,有多少个name=formName的表单就返回几。
    我们还是用实例说话吧:

    <form name="test1">
    	<input type="text" name="age" />
    	<input type="text" />
    	<div>表单name唯一</div>
    </form>
    <form name="test2">
    	<input type="text" name="age" />
    	<input type="text" />
    	<div>表单name不唯一</div>
    </form>
    <form name="test2">
    	<input type="text" name="age" />
    </form>
    
    document.test1.length // -->2
    document.test2.length // -->2
    

    实践后发现,当表单name唯一时,length为2;当name不唯一(有两个)时,也返回2。为什么呢?

    当name唯一时,documen.formName返回的不是一个数组,所以一开始想得是length属性不存在,document.formName.length应该返回undefined,但是事实却不是这样。

    当name唯一时,document.formName.length返回的是表单下输入框的元素个数,而当name不唯一时,返回的才是真正的表单个数。
    那么如何判断表单的name属性是否唯一呢?

    一般写使用表单的话,下面一定会有输入框,无论name属性是否唯一,document.formName[0]都有值,但是当name唯一下,document.formName[0][0]是没有元素的,即结果为undefined,而当name不唯一时,document.formName[0][0]返回的是第一个表单下的第一个子元素

    因此,可以通过document.formName[0][0]来判断表单的name属性是否唯一,当返回结果为undefined时,则表示name属性唯一,否则即存在多个name相同当表单
    延伸:

    通过document.formName.elements[subName]或document.formName.subName的形式可以获取form下元素。
    如:

    <form name="test">
    	<input type="text" name="myName" value="happy" />
    </form>
    
    <script>
    	document.test.myName.value  // happy
    </script>
    

    参考:

    1. Is it OK to have multiple HTML forms with the same name?
    2. Javascript document.forms value does not work for Internet Explorer
    展开全文
  • document.form选择表单元素

    千次阅读 2019-02-24 23:39:11
    1、document.forms: 选取页面所有的表单 2、document.forms['myform']; 获取name值为myform的表单 ...4、document.formName.elementName.value ; 获取表单input元素的值 &lt;form name='mine',id = 'one'...

    1、document.forms:    选取页面所有的表单

    2、document.forms['myform']; 获取name值为myform的表单

    3、 document.forms[0]; 选择第一个表单;

    4、document.formName.elementName.value  ; 获取表单input元素的值 

    <form name='mine',id = 'one' method='get'>
          <input type='text' name='txt'/>
    
    var f = document.forms;
    f[0].innerHTML = '<tr><td>猪头好大<td/></tr>';
    
    //获取mine下面的name为txt的元素的值
    var r= document.mine.txt.value;
    

    关于表单做的判断:

    展开全文
  • document.form.elementname获取元素时,如果元素有多个,可以通过数组形式获取 for(var i=0;i&lt;document.form.elementname.length;i++){  document.form.elementname[i].value; } 但是name=elementname的元素...


    document.form.elementname获取元素时,如果元素有多个,可以通过数组形式获取
    for(var i=0;i<document.form.elementname.length;i++){
       document.form.elementname[i].value;
    }
    但是name=elementname的元素只有一个时,document.form.elementname[i].value为undefined;只能通过document.form.elementname的形式来获取。
    可以通过如下形式来获取:
    if(!document.form.elementname[0]){
      document.form.elementname.value
    }esle{
      for(var i=0;i<document.form.elementname.length;i++){
       document.form.elementname[i].value;
       }

    }

     

    以上是通过原生js方法获取的元素,也可以再元素内加入class标签,进行获取元素,以下三种通过jquery选择器获取元素的区别如下:

    $('.classname').get(0);

    $('.classname')[0];

    $('.classname').eq(0);

    他们的区别在于前两种获得的是dom对象,而最后一种获得的是jquery对象,前两种用js的方法innertext,后一种用jquery的方法text();

    展开全文
  • document.form.action,表单分向提交,javascript提交表单 同一个表单可以根据用户的选择,提交给不同的后台处理程序。即,表单的分向提交。如,在编写论坛程序时,如果我们希望实现用户在发送贴子的时候,既发送提交...

    document.form.action,表单分向提交,javascript提交表单

    同一个表单可以根据用户的选择,提交给不同的后台处理程序。即,表单的分向提交。如,在编写论坛程序时,如果我们希望实现用户在发送贴子的时候,既发送提交功能又有预览功能时,就会遇到上述问题。即,当用户点击提交按钮时,我们希望表单提交给"提交"处理程序;而当用户点击预览按钮时,我们希望表单提交给"预览"处理程序。那么,如何实现上述功能呢?下面代码可以很好的解决这个问题。

    <form name="form" method="post">
    测试表单:<input name="test"><br>
    <input type="button" value="提交" onClick=send()>
    <input type="button" value="预览" onClick=preview()>
    </form>
    <script language=javascript>
    function send()
      {
        document.form.action="send.asp"
        document.form.submit()
       }
    function preview()
       {
         document.form.action="preview.asp"
         document.form.submit()
       }
    </script>

    关于上面实例的两点说明:

           1、在整个表单中,不应有名字为action或submit的标签,否则将会产生"对象不支持此属性和方法"的错误。如代码 "<input type='xxxx' name='action' >"在表单中是不允许出现的;

           2、在form标签中应该存在name属性。即,应该给表单取一个名字。语句document.form.action和document.form.submit中的"form"也就是表单的名字。

           表单的分向提交不仅仅使用在论坛的程序中,它还可以运用在许多场合下。恰当的运用表单的分向提交功能可以大大的增强网站的人性化程度。

     

           昨天,我调试程序就出现了这样的问题,就是出现了"对象不支持此属性和方法"的错误,一直无法定位出来,都快疯掉了,后来在发现一个button命名为submit了。

    <form   name="formname"   action="">   
      <input   name="inputname">   
      <input   type="submit"   οnclick="document.formname.action='a.asp'"   value="button   a">   
      <input   type="submit"   οnclick="document.formname.action='b.asp'"   value="button   b">   
      <input   type="submit"   οnclick="document.formname.action='c.asp'"   value="button   c">   
      </form>       
      2.----------   
      <input   type=button   name="a"   value="a"   οnclick="this.form.action='a.asp';this.form.submit();">   
      <input   type=button   name="b"   value="b"   οnclick="this.form.action='b.asp';this.form.submit();">   
      <input   type=button   name="c"   value="c"   οnclick="this.form.action='c.asp';this.form.submit();">   
      <input   type=button   name="d"   value="d"   οnclick="this.form.action='d.asp';this.form.submit();">
    

    转载连接: 原文链接


    展开全文
  • document.form.action,表单分向提交

    千次阅读 2016-07-13 12:22:08
    document.form.action,表单分向提交,javascript提交表单 同一个表单可以根据用户的选择,提交给不同的后台处理程序。即,表单的分向提交。如,在编写论坛程序时,如果我们希望实现用户在发送贴子的时候,既发送提交...
  • 本文转载自:IT摆渡网 --一个按难度收费的IT实时问答平台!快速解决你的任何技术问题!-- ... ...而且要没有submit这个按钮才能自动提交,比如下面这样: ...document.form1.submit(); 只有这样,才可以自动提交!
  • 1.首先说说我遇到的问题:做毕设时,需要删除会员,我的想法是...(提示:关键语句:document.form1.submit()) 2.思路:点击删除---->弹出确认框---->确认---->调用表单---->通过表单的doPost()方法重...
  • 当表单…中含有name=”submit”时,提交时就会有冲突,这个错误常见于按钮上,如:在Javascript做submit()的时候就会出现冲突,这时将name=”submit”改成别的比如login之类的就可以了,反正submit在这个情况下是个...
  • <! DOCTYPE html > < html ...form ..."form1" ..."console.log(document.form1.username.value)"  />   <!--->name换成ID也可以   form > body > html >
  • document.form.submit()的使用

    万次阅读 2012-05-21 16:39:46
    1、example: submit 参考:http://zhidao.baidu.com/question/96051969.html ...关于Html form表单的提交,很容易。。。但如果不仔细还是能有很多错误 http://www.iteye.com/topic/311433
  • 代码如下: name="submit" value="提交">...document._thisform.submit(); } 网上很多都说需要通过判断如果是谷歌浏览器则用ajax方式提交: $.post(); uncaught TypeError: Property 'sub
  • 有时候,用document.forms[0].submit() 或document.getElementById("formId").submit()方法时候,明明书写没有错误却总是报这个错误,说对象不支持此属性或方法。 在button的input中,name属性不要使用...
  • 我找了好久,都没发现问题,也问了好多网友,都没找到什么办法解决document.form1.submit()对象不支持此属性或方法的办法.今天,突然找到一个人提供的办法,终于解决了这个问题,果然是个很小和问题,原来,我在用...
  • 原生javascript 表单同步提交和提交前操作 var_dump($_POST); ?> function SendForm () { if(CheckPost()) { document.addForm.submit(); } } function Check
  • Line:71Char:3Code:0Error:document.form.name 为空或不是对象网址:http://localhost/test/123.html 以下是代码,请大家帮帮忙,问题出在哪了。我是初学者,实在是弄不明白了。留言板function Agree_onclick() { ...
  • JS表单document.forms的用法(详解)

    千次阅读 2020-08-13 11:18:48
    document.forms 表示获取当前页面的所有表单 document.forms[0] 表示获取当前页面的第一个表单 document.forms[‘exportServlet’] 表示获取当前页面的name="exportServlet"的表单 document.forms[...
  • 概述 forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素. 语法 var collection = document.forms; 例子 获取表单信息 [removed] ...console.info(thisForm.username.va
  • document.forms.length 计算文档中form 表单的数目; 如: document.forms.elements.length 是统计form 表单中元素节点的总数。 如: 统计这个表单里面元素的总数可以直接这样: document.fr.elements....
  • 用新方法document取得FORM中的元素的value function sub() { var name = document.forms['theForm'].elements['name'].value; var sex = document.forms['theForm'].elements['sex'].value; alert(name); alert...
  • document.forms的用法(详解)

    万次阅读 多人点赞 2019-03-22 17:05:24
    document.forms 表示获取当前页面的所有表单 document.forms[0] 表示获取当前页面的第一个表单 document.forms[‘exportServlet’] 表示获取当前页面的name="exportServlet"的表单 document.forms[...
  • 在项目中遇到这样一个情况,在页面中想通过javascript 方法提交form数据情况,在javascript方法中添加了document.forms[0].submit();这样写已经非常习惯了,但这次,每次调用该方法时,IE总报“对象不支持此属性或...
  • document.forms[].submit()使用介绍

    千次阅读 2016-09-14 18:59:50
    document.forms['exportServlet'].submit();  (1)document.forms:表示获取当前页面的所有表单  (2)document.forms[0]:表示获取当前页面的第一个表单  (3)document.forms['exportServlet']:表示获取...
  • document.form.xxxx方式获得表单元素

    千次阅读 2013-10-13 23:26:12
    这是老式的获取表单元素的方法,例如if(document.form.password.value==""),它先找id为password的元素,找不到则找name属性为password的元素,再找不到就会报错。当然对于这句它是在name或id属性为form的标签中找的...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 321,658
精华内容 128,663
关键字:

document.form