2013-04-30 146 views
89

我很好奇<input type="hidden">標籤的原始用途。<input type =「hidden」>的原意是什麼?

現在,它經常與JavaScript一起用於存儲發送到服務器的變量以及類似的東西。

釋放。因此,在<input type="hidden">前的JavaScript存在,所以是什麼樣的初衷?我只能想象從服務器向客戶端發送一個值(未發送),以保持一種狀態。或者我在歷史中遇到錯誤,並且<input type="hidden">總是應該與JavaScript一起使用?

如果可能,請在答案中提供參考。

+3

SO主題雖然維護狀態也是我的選擇 – Phil 2013-04-30 06:41:21

+0

同意,允許跟蹤預填充狀態(例如在編輯過程中的代理項目PK),它將自動包含在提交的表單中POST/GET – StuartLC 2013-04-30 06:44:59

+1

現有*之前* JavaScript *支持*理由讓他們更多(也就是說,它不會減少任何原因,因爲這個問題似乎暗示) - 沒有JavaScript來「存儲變量」或調用AJAX或存根「非隱藏「輸入字段之前,也沒有其他不正當的黑客入侵的CSS,如隱藏正常的文本輸入。 – user2246674 2013-04-30 06:45:21

回答

95

我只能想象從服務器發送一個值到客戶端,它是(不變)發回保持一種狀態的。

準確地說。實際上,它今天仍然用於這個目的,因爲我們今天所知道的HTTP仍然是,至少從根本上說是一個無狀態的協議。

此用例實際上是首先在HTML 3.2描述(我很驚訝HTML 2.0不包括這樣的描述):

type=hidden
這些字段不應該被渲染並且爲服務器提供的裝置用表單存儲狀態信息。當提交表單時,這將使用由相應屬性定義的名稱/值對來傳遞迴服務器。這是HTTP的無狀態工作。另一種方法是使用HTTP「Cookie」。

<input type=hidden name=customerid value="c2415-345-8563"> 

雖然這是值得一提的是HTML 3.2成爲W3C推薦標準只 JavaScript的最初版本,它是安全的假設,隱藏字段具有幾乎總是服務於同樣的目的。

+0

我不喜歡使用'隱藏'輸入來存儲數據的一件事是,數據可以由用戶操縱,可能只有懂得HTML的人以及如何通過開發工具修改它,但可能會產生不好的影響在數據庫上如果修改這些值會破壞其他數據(例如,如果您存儲主鍵引用並由用戶手動更改)。 – Brett84c 2016-06-16 15:53:56

+2

@ Brett84c:這就是爲什麼你應該始終驗證你的輸入,並永遠不要相信客戶;) – BoltClock 2016-06-16 17:31:44

+0

準確地說,我只是把它扔到那裏讓新開發人員意識到可能存在的危險。 – Brett84c 2016-06-16 21:03:54

7

簡而言之,最初的目的是創建一個將以表單提交的字段。有時,需要在隱藏字段中存儲一些信息(例如,用戶的id)並使用表單的提交進行提交。

從HTML 1995年9月22日說明書

用`TYPE = HIDDEN」表示隱藏field.The用戶 不與該磁場相互作用的輸入元件;相反,VALUE屬性 指定了該字段的值。 NAME和VALUE屬性是 必需的。

+1

您能否詳細說明該答案和/或提供表單提交後提交隱藏字段的這種行爲? – GitaarLAB 2013-04-30 06:46:30

+0

@GitaarLAB,我舉了一個例子(用戶ID)......無論如何,網上有很多例子。例如,http://www.echoecho.com/htmlforms07.htm – 2013-04-30 06:49:52

+1

對不起,對我而言:'最初的目的是在*表單提交後提交的字段不明確。它可以被解釋爲:'在表單完成發佈其數據後*然後*隱藏字段將被提交(到一個神祕的地方)'。因此,我的評論如上。 – GitaarLAB 2013-04-30 06:56:08

9

我會在這裏提供一個簡單的服務器端真實世界示例,例如,如果記錄是循環的,並且每條記錄都有一個帶有刪除按鈕的表單,並且您需要刪除特定記錄,那麼請在此處輸入hidden字段,否則你不會得到在這種情況下,要刪除的記錄的參考,這將是id

例如

<?php 
    if(isset($_POST['delete_action'])) { 
     mysqli_query($connection, "DELETE FROM table_name 
            WHERE record_id = ".$_POST['row_to_be_deleted']); 
            //Here is where hidden field value is used 
    } 

    while(condition) { 
?> 
    <span><?php echo 'Looped Record Name'; ?> 
    <form method="post"> 
     <input type="hidden" name="row_to_be_deleted" value="<?php echo $record_id; ?>" /> 
     <input type="submit" name="delete_action" /> 
    </form> 
<?php 
    } 
?> 
+2

很好的基本例子。 – BoltClock 2013-04-30 07:02:32

+1

很好的例子,除了真正的代碼應該使用預處理語句或其他方式來安全地處理SQL輸入。 – 2014-04-22 01:16:43

4

基本上隱藏字段將更加有用和優勢的多步使用形成。 我們可以使用隱藏字段來傳遞一步信息到下一步使用隱藏並保持轉發直到結束步驟。

  1. CSRF令牌。

跨站請求僞造(http://en.wikipedia.org/wiki/Cro...)是一個非常常見的網站漏洞。在所有表單提交中要求祕密的用戶特定標記將防止CSRF攻擊,因爲攻擊站點無法猜測正確的標記是什麼,並且它們代表用戶執行的任何表單提交將始終失敗。

  1. 以多頁形式保存狀態。

如果您需要存儲用戶當前所處的多頁表單中的步驟,請使用隱藏的輸入字段。用戶不需要看到這些信息,因此將其隱藏在隱藏的輸入字段中。

一般規則: 使用此字段可存儲用戶不需要查看的任何內容,但您希望在表單提交時將其發送到服務器。

4

當表單發佈時,表單元素的值(包括type ='hidden')將被提交給服務器。輸入類型=「隱藏」值在頁面中不可見。例如,在隱藏字段中維護用戶ID是衆多用途之一。

SO使用隱藏字段進行upvote點擊。

<input value="16293741" name="postId" type="hidden"> 

使用此值,服務器端腳本可以存儲upvote。

+0

哈哈,趕上!當我在值的末尾附加一個「x」時,upvoting時會出現錯誤:D – Uooo 2013-04-30 06:55:16

+0

@Uooo您可以取消隱藏或直接更改該值。您可以將該值更改爲不同的答案。然後,您可以點擊upvote按鈕,並以不同的答案登錄爲upvote。 ;) – 2015-06-25 18:49:09

相關問題