當前位置: 首頁>>代碼示例 >>用法及示例精選 >>正文


HTML Form name用法及代碼示例


DOM表單名稱屬性用於設置或返回表單中name屬性的值。每個輸入字段都需要name屬性。如果未在輸入字段中指定name屬性,則將根本不發送該字段的數據。

用法:

  • 它用於返回name屬性。
    formObject.name
  • 它用於設置name屬性。
    formObject.name = name
  • 屬性值


    • name:它指定表單的名稱。

    返回值:它返回一個代表表單名稱的字符串值。

    示例1:說明如何返回屬性的HTML程序。

    <!DOCTYPE html> 
    <html> 
      
    <body style="text-align:center;"> 
        <h1 style="color:green;"> 
          GeeksForGeeks 
      </h1> 
        
        <h2>DOM Form name Property.</h2> 
        <form id="users" 
              action="#" 
              name="Geeks"> 
            First name:
            
            <input type="text" 
                   name="fname" 
                   value="Manas"> 
            <br> Last name:
            
            <input type="text" 
                   name="lname" 
                   value="Chhabra"> 
            <br> 
            
            <input type="submit" 
                   value="Submit"> 
        </form> 
      
        <p>Click the "Try it" button to return 
          the name of the Form </p> 
      
        <button onclick="myGeeks()"> 
          Try it 
        </button> 
      
        <p id="sudo" 
           style="font-size:25px;color:green;"> 
      </p> 
      
        <script> 
            function myGeeks() { 
                
                //  Return the property 
                var x = document.getElementById( 
                  "users").name; 
                
                document.getElementById("sudo").innerHTML =  
                  "The name of the Form is " + x; 
            } 
        </script> 
      
    </body> 
      
    </html>

    輸出:

    在單擊按鈕之前:

    單擊按鈕後:

    示例2:說明如何設置屬性的HTML程序。

    <!DOCTYPE html> 
    <html> 
      
    <body style="text-align:center;"> 
        <h1 style="color:green;">GeeksForGeeks</h1> 
        <h2>DOM Form name Property.</h2> 
        
        <form id="users" 
              action="#"
              name="Geeks"> 
            First name:
            
            <input type="text"
                   name="fname" 
                   value="Manas"> 
            <br> Last name:
            
            <input type="text" 
                   name="lname" 
                   value="Chhabra"> 
            <br> 
            
            <input type="submit" 
                   value="Submit"> 
        </form> 
      
        <p>Click the "Try it" button to  
          set the name of the Form </p> 
      
        <button onclick="myGeeks()"> 
          Try it 
      </button> 
      
        <p id="sudo"
           style="font-size:25px; 
                  color:green;"> 
      </p> 
      
        <script> 
            function myGeeks() { 
              
                // Set the name attribute value. 
                var x = document.getElementById( 
                  "users").name = "users"; 
                document.getElementById("sudo").innerHTML =  
                  "The value of the name attribute was changed to " 
                + x; 
            } 
        </script> 
      
    </body> 
      
    </html>

    輸出:

    在單擊按鈕之前:

    單擊按鈕後:

    支持的瀏覽器:下麵列出了DOM表單名稱屬性支持的瀏覽器:

    • 穀歌瀏覽器
    • IE瀏覽器
    • Firefox
    • Opera
    • Safari


相關用法


注:本文由純淨天空篩選整理自ManasChhabra2大神的英文原創作品 HTML | DOM Form name Property。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。