綁定文本框內的輸入文本

我有一個文本框和一個按鈕。當按鈕被點擊時，頁面被重定向到相同的url，我希望輸入的字段保持綁定在文本框內。我怎樣才能做到這一點？綁定文本框內的輸入文本

代碼

<input type="text" size="25" style="background-color:#D8D8D8" id="to"/><br><br> 

<input type="submit" name="scheduleSubmit" value="Submit" id="scheduleSubmit" 
    <button class="btn btn-round btn-success" type="button"></button>

按鈕onclick事件

var textBox2 = document.getElementById('to'); 
value = "?from="+ textBox1.value ; 
location.href = "http://127.0.0.1:8000/new/reports/daily/" + value ; 
document.getElementById("to").value= textBox2.value;

來源

2013-11-24 Laxmi Kadariya

你能更好地解釋「輸入的字段仍然在文本框內綁定」嗎？ – Sergio

當按鈕被點擊並重定向時，字段變空，但我想要顯示先前輸入的文本 –

的名字，爲您的文本字段，你want.for例如什麼都，我命名爲文本域 文本框。然後檢查是否從給定的文本字段發送請求;如果是，請保持綁定的值。如果沒有，它會使值爲空。「我使用的代碼」在這裏是PHP，因此您需要像wampserver這樣的服務器才能看到所需的結果。否則，什麼都沒有發生'

<input type="text" name = 'textField' value =" if(isset($_REQUEST['textField'])) { echo $_REQUEST['textField'] } else { echo '' } " size="25" style="background-color:#D8D8D8" id="to"/><br><br>

來源

2013-11-24 09:05:42 MrSir

您可以使用javascript解析查詢字符串。查詢字符串存儲在location.search對象內，還包含?。

首先，捕捉查詢字符串的東西，你可以工作：

var queryString = location.search.substr(1); // substr(1) will cut off the ? character

然後實際的字符串解析爲一個對象：

function parseQuery(str) { 
    var result = {}; // going to store the key-value (kvp) pairs in here 
    var pairs = str.split('&'); // break it up by the standard ampersand delimiter 
    for (var i = 0; i < pairs.length; i++) { // go through each of the pairs 
     var kvp = pairs[i].split('='); // parse the individual pair using = as the delimiter 
     result[kvp[0]] = kvp[1]; // kvp[0] contains the name of the field, kvp[1] contains the value 
    } 
    return result; 
} 
var parsedQueryString = parseQuery(queryString);

而現在填充表單輸入元素：

document.getElementById('to').value = parsedQueryString.to||'';

詳細說明前一行，parsedQueryString現在是o （從上面的函數返回result）。輸入字段名爲to，它對應於查詢字符串中的鍵。我們可以通過parsedQueryString.to訪問它，但是，如果它沒有包含在查詢字符串中，我們希望它通過默認分配空字符串''：parsedQueryString.to || ''而優雅地失敗（使用或運算符||）。

這裏是一個工作示例：

<!doctype html> 
<html> 
    <head> 
     <title>JS Form</title> 
    </head> 
    <body> 
     <form method="get"> 
      <p><input type="text" size="25" id="to" name="to" /></p> 
      <p><input type="submit" value="Submit" id="scheduleSubmit" name="scheduleSubmit" /></p> 
     </form> 
     <script type="text/javascript"> 
      function parseQuery(str) { 
       var result = {}; 
       var pairs = str.split('&'); 
       for (var i = 0; i < pairs.length; i++) { 
        var kvp = pairs[i].split('='); 
        result[kvp[0]] = kvp[1]; 
       } 
       return result; 
      } 
      var queryString = location.search.substr(1); 
      var parsedQueryString = parseQuery(queryString); 
      document.getElementById('to').value = parsedQueryString.to||''; 
     </script> 
    </body> 
</html>

注意，無法在form元素的action屬性只會讓瀏覽器「後」 /「獲取」的數據到當前頁面。

來源

2013-11-24 09:37:33 zamnuts

綁定文本框內的輸入文本

回答

相關問題