HTML表單：如何記住按鈕單擊的文本值？

Question

如果您有form ，請在其中輸入一些文本，然后按Enter鍵，每當重新訪問該form時，您都可以雙擊輸入框並查看過去的文本提交。

我有一個網站，當您按Enter或單擊一個按鈕時，它應該使用文本框中的內容並將其用於數據處理。

當不被form包圍時，這是完全可以的，但是當被form包圍時，您可以按Enter鍵，它不能用作回車按鈕的按下，我相信它已被form覆蓋。

我的目標是使用戶既可以按Enter鍵也可以單擊按鈕提交數據，但是無論您以哪種方式提交數據，也要記住文本框中的文本值。

我有的：

<input type="text" id="username-field" class="form-control" placeholder="username">
<input class="btn btn-default" type="button" id="get-name" value="Get Name">

Java腳本

$("#get-name").click(function() {
    var name = $("#username-field").val();
    // ... call other function with name ...
});
$("#get-name").keydown(function(e) {
    if (e.which == 13) {
        var name = $("#username-field").val();
        // ... call other function with name ...
    }
");

我想使用的是：

<form>
   <input type="text" id="username-field" class="form-control" placeholder="username">
</form>

當按下Enter鍵時，我嘗試執行e.preventDefault() ，但這不記得輸入字段中的文本。

我也考慮過做一個小型的緩存類型的事情，但是不確定如何處理。

任何幫助將非常感激！

謝謝！

Answer 1

1. 完全不使用form 。 只是，如果不按預期使用它，為什么要添加它？
2. 您輸入了錯誤的提供的代碼復制粘貼，或者在腳本中出錯（ $("#get-name").val()錯誤）。

3. 如果要阻止表單提交，則應在提交處理程序中使用e.preventDefault() -it，並從中返回false ：

    $('#form-id').submit(function (e) { e.preventDefault(); // do smth. else here ... return false; }) 

4. 使用localStorage為支持HTML5的瀏覽器保存/獲取數據：

    $(function () { $('form input[type=text]').doubleclick(function () { var id = $(this).attr("id"); value = localStorage.getItem("form_xxx_" + id); // do smth. with cached value, ie: if (value != "") $(this).val(value); // put in textfield }); }); $('form').submit(function (e) { $('form input[type=text]').each(function () { var id = $(this).attr("id"); localStorage.setItem("form_xxx_" + id, $(this).val()); }); ... // all other work }); 

注意：請確保您沒有將某些用戶的個人數據放入瀏覽器的本地存儲中-_-