document.forms用法示例介绍

最新推荐文章于 2021-06-15 14:09:29 发布
最新推荐文章于 2021-06-15 14:09:29 发布
阅读量4.7k 收藏 1
点赞数 1
分类专栏： JavaScript

document.forms用法示例介绍

forms 返回一个集合 包含了了当前文档中的所有form元素，下面通过示例为大家介绍下document.forms用法,

概述

forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素.

语法

var collection = document.forms;

例子

获取表单信息

<pre name="code" class="html"><pre name="code" class="html"><!-- 以下为三个简单的form表单 -->
<form action="x" name="form1" > 
<input type="text" name="username" value="zhangsan" /> 
<input type="text" name="address" value="beijing" /> 
</form> 

 

<form action="x" name="form2" > 
</form> 
 
<form action="x" name="form3" > 
</form> 
 



 

 

<body> 
<pre name="code" class="html"><script type="text/javascript"> 
$(function(){ 
var thisForm = document.forms['form1']; //获取name为form1的form表单 
//或者 
//var thisForm = document.forms[0]; //获取第一个form表单 
console.info(thisForm.username.value); //输出表单name属性值为form1的 username的值 
console.info(thisForm.address.value); 
document.forms[0].submit(); //表单提交 
}) 
</script>
</body> 

 

 

 


 
 

转自：http://www.jb51.net/article/51559.htm

                

        

        

    




    

      

        

            

              
                
                  ssisse
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    1
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    1
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
document.forms

				
			

			

				

					sjhdjskhakj的博客
				

				

					06-21
					
					962
					
				

			

		

		

			
				
document.forms

			
		

	



                

              
                



	

		

			

				
					
document.forms用法

				
			

			

				

					itmyhome的专栏
				

				

					03-01
					
					4645
					
				

			

		

		

			
				
概述

forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素.

语法
var collection = document.forms; 
<form action="x" name="form1" >
		<input type="text" name="username" value="zhangsan" />
		<input type="text" name="address" value="beijing" />
	</form>

			
		

	



                


  
              

                


	

		

			

				
					
关于document.forms

				
			

			

				

					helloworlddm的博客
				

				

					01-19
					
					367
					
				

			

		

		

			
				
forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素.




html>
        head>
                title> document form testtitle>
        head>
        body>
                form action="1.html" name="for

			
		

	





	

		

			

				
					
JS中关于document.all的详解

				
			

			

				

					10-18
				

			

		

		

			
				
document.forms("formname") // IE中使用 document.forms["formname"] // 标准方法 ``` 这里展示了两种获取表单的方式，第一种仅适用于IE浏览器，而第二种则是标准方法，兼容性更好。  ##### 示例2：修改元素样式 ``...

			
		

	



		

			
		



	

		

			

				
					
C#WinForm中CefSharp.Winform示例代码（VS2010、.net4.0）

				
			

			

				

					05-01
				

			

		

		

			
				
我们将使用VS2010作为开发环境，并且基于.NET Framework 4.0进行开发。CefSharp.Winform版本49.0.1将是我们讨论的核心。  首先，确保你已经安装了Visual Studio 2010和.NET Framework 4.0。然后，从NuGet包管理器...

			
		

	





	

		

			

				
					
javascript document 对象的用法大全

				
			

			

				

					08-30
				

			

		

		

			
				
### JavaScript Document 对象详解  #### 一、Document 对象简介  在Web开发中，`document`对象是浏览器提供的一种能够操作HTML文档的方式。...掌握这些API的使用方法对于提高Web开发效率具有重要意义。

			
		

	





	

		

			

				
					
document.forms[].submit()

				
			

			

				

					casllas
				

				

					09-20
					
					599
					
				

			

		

		

			
				
document.forms[].submit()

			
		

	





	

		

			

				
					
document.forms对象

				
			

			

				

					徐海兴的专栏
				

				

					09-08
					
					827
					
				

			

		

		

			
				
Document
  
	
		function doSubmit(){
			var name=document.forms["form1"].name.value;//name为form1的，input name为name的
			var password = document.forms[0].password.value;//第一个form表单，input name为password的

			
		

	





	

		

			

				
					
document.forms的用法(详解)

					
热门推荐

				
			

			

				

					念念不忘，必有回响
				

				

					03-22
					
					3万+
					
				

			

		

		

			
				
代码
作用




document.forms
表示获取当前页面的所有表单


document.forms[0]
表示获取当前页面的第一个表单


document.forms[‘exportServlet’]
表示获取当前页面的name="exportServlet"的表单


document.forms[‘exportServlet’].username.value
获取表单为e...

			
		

	





	

		

			

				
					
javascript当中document.forms的用法

				
			

			

				

					mark_to_win的专栏
				

				

					03-24
					
					1551
					
				

			

		

		

			
				
2.document.forms例 2.1（FormActionSubmitIEFF.html）<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><head> <meta http-equiv="content-type" content="text/html; c...

			
		

	





	

		

			

				
					
HTML通过使用‘document.forms’获取表单中填写的所有信息

				
			

			

				

					knight31318的专栏
				

				

					04-04
					
					1397
					
				

			

		

		

			
				
如下文所示，假设我们希望能够提取到form中每一个元素（包含最后提交按钮）的值，然后可以拿作它用，比如说在页面下面显示一遍：
<!DOCTYPE html>
<html>
<body>

<h1>使用 document.forms 查找 HTML 元素</h1>
---------------------------------------------------------------------
<form id="frm1">
.

			
		

	





	

		

			

				
					
document.form1(<form name="form1">).（可以根据id=“” 和name=" "）.value得到值

				
			

			

				

					a464064368的博客
				

				

					03-14
					
					2489
					
				

			

		

		

			
				
DOCTYPE html>
html>

head>
    meta charset="UTF-8">
    meta http-equiv="X-UA-Compatible" content="IE=edge">
    meta name="viewport" content="width=device-width, initial-scale=1">
head>

bo

			
		

	





	

		

			

				
					
webform怎样使用html模板,用WebBrowser实现HTML界面的应用

				
			

			

				

					weixin_31316383的博客
				

				

					06-15
					
					451
					
				

			

		

		

			
				
HTML的界面有以下特点：图文混排，格式灵活，可以包含Flash、声音和视频等，实现图文声像的多媒体界面，而且易于建立和维护。另外，HTML的显示环境一般机器上都具备，通常不需要安装额外的软件。当然，HTML界面也有它欠缺的方面，即：界面控制能力有限，代码调试不便----虽然DHTML提供了比较强的编程特性，但是比起Delphi的传统的开发语言和工具来，对界面的控制能力，尤其是和数据交互时的控制能...

			
		

	





	

		

			

				
					
function generateReport() {

	     try{
	        var getUrl = window.location;
	        var baseUrl = getUrl.protocol + "//" + getUrl.host + "/";
	        var url = baseUrl + 'polarion/ImpactAnalysisTree/ImpactAnalysisTree?projectId='+projectId;

	        var parameters = "";
	        var Id =false;
	        var title = false;

	        var workItemId = document.forms["tracegraph"]["itemId"];
	        if(workItemId != null ){
	            if(!workItemId.value.trim().length == 0 ){
	                parameters = '&op=search&workItemId=' + workItemId.value;
	                Id = true;
	            }
	        }
	        if( !Id){
	            $(".widget-errors").text("Enter a valid Work Item ID /Title to generate traceability report.").show();
	            return false;
	        }

	        // Post
	        $(location).attr('href', url+parameters)
	      } catch (e){
	         console.log(e);
	         alert(e);
	      }
	      return false;
	    }  
获取代码块的返回值并重新渲染页面

					
最新发布

				
			

			

				

					07-14
				

			

		

		

			
				
这段代码的目的是生成一个报告，并且在生成报告之后重新渲染页面。然而，根据代码的逻辑，这段代码并没有直接返回任何值，并且重新渲染页面的操作是通过改变 `$(location).attr('href', url+parameters)` 来实现的。

所以，如果你想要获取代码块的返回值并重新渲染页面，你需要对该代码进行一些修改。一种可能的方法是使用 AJAX 异步请求来执行生成报告的操作，并在成功返回后重新渲染页面。

以下是一个示例代码，展示了如何使用 AJAX 异步请求来获取生成报告的返回值并重新渲染页面：

```javascript
function generateReport() {
  try {
    var getUrl = window.location;
    var baseUrl = getUrl.protocol + "//" + getUrl.host + "/";
    var url = baseUrl + 'polarion/ImpactAnalysisTree/ImpactAnalysisTree?projectId=' + projectId;

    var parameters = "";
    var Id = false;
    var title = false;

    var workItemId = document.forms["tracegraph"]["itemId"];
    if (workItemId != null) {
      if (!workItemId.value.trim().length == 0) {
        parameters = '&op=search&workItemId=' + workItemId.value;
        Id = true;
      }
    }
    if (!Id) {
      $(".widget-errors").text("Enter a valid Work Item ID /Title to generate traceability report.").show();
      return false;
    }

    // AJAX 异步请求
    $.ajax({
      url: url + parameters,
      method: 'POST',
      success: function(response) {
        // 在这里处理生成报告的返回值
        console.log(response);

        // 重新渲染页面的操作
        // ...

        // 示例：重新加载页面
        location.reload();
      },
      error: function(error) {
        console.log(error);
        alert(error);
      }
    });
  } catch (e) {
    console.log(e);
    alert(e);
  }
  return false;
}
```

请注意，以上示例代码仅供参考，并且还需要根据你的具体需求进行修改和调整。

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值