值與HTML中的佔位符屬性

我正在處理表單，並且有可能被用戶填充或不填充的字段。爲了簡化後端邏輯，我計劃從表單中獲取所有數據，並使用它全部更新我的記錄，而不管用戶輸入或輸入的字段是什麼。值與HTML中的佔位符屬性

我被告知（也許不正確），我可以採取數據庫中當前存在的數據（即在頁面加載時）並將其放入輸入區域的'value'屬性中。假設，這將使得如果用戶沒有向該字段輸入任何內容，舊的/當前的值將被簡單地傳回服務器並重新輸入（但未被更改）。

如果用戶輸入數據，那麼這將成爲新的價值。

因此，這將是這個樣子：

<input type='text' name='XYZ' value='<?php echo $record['XYZ']; ?>'></td>

-1 - 所以，第一個問題是，這是真的嗎？

第二個問題是我不希望在實際文本字段中顯示此值。因此，我在輸入標記中添加了一個佔位符屬性：

<input type='text' name='XYZ' value='<?php echo $record['XYZ']; ?>' placeholder=''></td>

但value屬性似乎覆蓋佔位符標記！

-2 - 所以第二個問題是，是否有指定的值，因爲我想，而不是它出現在實際的文本字段？

來源

2014-10-28 Jo.P

好的，是的。 value屬性定義「在輸入字段中」。這是輸入字段的值。有三種方式來影響這個值：輸入字段，通過Javascript更改它，或通過HTML屬性設置它。因此，如果您通過HTML屬性預填充值，然後提交表單，那就是將值提交回服務器。
佔位符是隻要實際值爲空就顯示的值。這是爲了向用戶提供他們應該進入該領域的暗示;一旦用戶輸入了某些內容或者填充了該字段（請參閱上文），就不再需要佔位符。

你必須決定你準備做什麼。假設你有一個用戶的個人資料頁面，用戶可以更新他們的信息，在這種情況下，我非常希望填寫所有當前信息並能夠更改它。我不想要空白字段，從可用性的角度來看它沒有任何意義。

如果你確實想空白領域，只更新在用戶已填充字段中的數據庫信息，最有用的技術可能是簡單地只更新那些用戶填寫字段：

// only these fields may be submitted 
$allowedFields = ['foo', 'bar', 'baz']; 

// protecting from invalid submitted data, simplifies SQL injection prevention 
if (array_diff(array_keys($_POST), $allowedFields)) { 
    throw new Exception('Invalid data submitted'); 
} 

// filter out fields which do not have any input 
$data = array_filter($_POST, 'strlen'); 

// prepare placeholders for binding data 
$placeholders = array_map(
    function ($key) { return "`$key` = :$key"; } 
    array_keys($data) 
); 

// prepare your query 
$query = sprintf('UPDATE table SET %s WHERE id = :id', join(', ', $placeholders)); 
$stmt = $pdo->prepare($query); 

$data['id'] = /* some id you get from somewhere to know what record to update */; 

$stmt->execute($data);

以上是假定PDO作爲數據庫適配器的示例，根據自己的需要對其進行更改。它表明儘管編寫只更新提交的列的動態更新非常簡單，你不需要用表單數據做特殊的技巧。

來源

2014-10-28 02:24:43 deceze

tnx求救！ – 2014-10-28 17:40:11

第一部分是正確的;您可以使用「value」屬性預設輸入字段的值，如第一個示例中所示。這是非常普遍的，也是網絡工作的一個很好理解的部分。

佔位符文本雖然與數值出現在相同的位置，但是不是的值，而是的值。它永遠不會提交，只有在沒有價值的情況下才會顯示。

你所描述的是可能的，使用JavaScript。但這是奇怪的，意想不到的行爲，並可能讓用戶感到困惑。將預先填入表單的值傳達給用戶：「你可以改變這個，但是如果你不這樣做的話，這將會被髮送。」堅持既定慣例通常是一個好主意。

這就是說，一種方法是使用JavaScript。您可以隱藏所有「真實」輸入字段，以便您的預填充字段對用戶不可見。然後，你可以有一個未命名的「虛擬」字段，這些字段被標記爲與真實字段相對應。當用戶在其中一個虛擬字段中輸入內容時，可以使用腳本將值複製到其隱藏的合作伙伴，以覆蓋預設值。

下面是一個例子：

HTML：

<input id="dummy_name" type="text" placeholder="Enter your name"> 
<!-- no name, there, notice: it won't be submitted --> 
<input id="real_name" type="hidden" name="name" value="Default">

JQuery的：

$('#dummy_name').change(function(){ 
    var user_input = $('#dummy_name').val(); // get the user input 
    $('#real_name').val(user_input);   // overwrite the value of the hidden field 
});

或在普通的JavaScript：

document.getElementById('dummy_name').onchange=function(){ 
    var user_input = document.getElementById('dummy_name').value(); 
    document.getElementById('real_name').value = user_input; 
};

如果你去這條路線，你也可能想要保存e變量中的默認值，以便在鍵入內容時將其恢復到隱藏字段，然後將其清除。但是，除非你有充分的理由，否則這一切都是令人沮喪的！

該解決方案是後端不可知的，但正如欺騙暗示的那樣，這可能更好地在服務器端處理。

來源

2014-10-28 02:28:21 hoverbikes

tnx尋求幫助和建議！ – 2014-10-28 17:41:21

是的，value屬性規定input字段的初始（缺省）值。（對於textarea，您可以改爲使用元素的內容。）是的，placeholder屬性值僅在字段沒有賦值的情況下顯示;它應該是預期輸入的一個暗示。
爲了設置一個值的字段不可見地，使用type=hidden：
```
<input type='hidden' name='XYZ' value='<?php echo $record['XYZ']; ?>'> 
```
然而，用戶然後可以不以任何正常方式改變的值。您也可以包含input元素和相同的name屬性，但是您存在提交的數據可能包含兩個條目的問題，以及如何確定哪個元素是正確的？那麼，您可以使用不同的name屬性，例如，
```
<input type='hidden' name='XYZ-default' value='<?php echo $record['XYZ']; ?>'> 
<input type='text' name='XYZ'> 
```
那麼你的表格數據處理只是要檢查XYZ數據是否存在，如果沒有，用XYZ-default數據代替。

但是，目標聽起來像可憐的可用性。你要求用戶輸入一些東西，它有一個默認值，但你不告訴用戶它是什麼。所以你可能會強迫用戶輸入一些你已經擁有的數據。

來源

2014-10-28 07:19:15

感謝您的幫助！ – 2014-10-28 17:40:58

我同意欺騙用戶可能會發現它有助於查看他們提交的信息。我目前正在使用jQuery和Javascript，而不是PHP，所以雖然我不知道PHP及其相關工具的功能，但我知道jQuery有一種動態改變佔位符值的方法;如果那是沒有與您使用的語言和工具共享的東西，我會非常驚訝。

按照用戶的觀點來看待他們提交的內容，您可以始終保持佔位符與提交內容的最新狀態。這樣，如果他們想改變它，他們可以寫下來，但如果他們不這樣做，他們仍然會看到進展情況。如果您只能在輸入標籤的值發生更改時才進行更新，而不是每次都將後端存儲的信息替換爲佔位符，那麼它使用的額外資源也將最小化。如果你真的想保持簡單，就像你所要求的那樣，你也可以引用舊值的佔位符，但除非你是新的或特殊情況，否則這是一種效率低下的方法。

這當然是一個妥協，從你要求的東西，用戶不會看到。如果你的舊信息是隱形的，那麼這將不會有幫助，但即使這已經有幾年了，我想我會提出這個建議。畢竟，可能有一些來這裏的人對這些概念相對陌生，也可能從中找到一些用處。我知道這是我會欣賞的。

此外，在對第二個問題的進一步迴應中，現在有方法可以將數據添加到不影響其性能或正常行爲的html元素。我發現這個鏈接是用於Javascript的，但我想再次想象穿越語言障礙會相對簡單，特別是對於Google。

我相信這隻適用於HTML5，而不適用於XHTML。但希望它有幫助。請記住，將數據存儲在後端（在您的PHP代碼中）將比來回引用這些值更快。我相信這是在這個環節中提到的。我認爲這隻對大規模項目纔是真正重要的，所以如果你正在尋求效率，這不應該成爲你首選的方法，但你可能會發現自己處於一個更容易利用它的位置。

http://html5doctor.com/html5-custom-data-attributes/

來源

2016-07-26 14:34:03 Ian

值與HTML中的佔位符屬性

回答

相關問題