在輸入文本元素中按下“enter”時停止頁面刷新

Question

當在輸入文本元素中按下回車按鈕時，有沒有辦法阻止網頁完全刷新？

我正在尋找創建一個搜索字段，我可以從按下輸入時獲取文本以過濾對象，並僅顯示包含搜索字段中文本的文本。

我嘗試了以下嘗試捕捉輸入按鈕，但它不起作用。

function setupSearchField() {
    document.getElementById("searchField").onKeyDown = function(event) {
        var holder;
        if (window.event) {
            holder = window.event.keyCode;
        } else {
            holder = event.which;
        }
        keyPressed(holder);
    }
}

function keyPressed(key) {
    if (key == 13) {
        event.cancelBubble = true;
        return false;
    }
}

Answer 1

如果input元素位於表單內，並且該表單實際上未提交給服務器，請刪除該表單。

您的代碼不起作用的原因是因為onkeydown事件應該是小寫的，並且您實際上並沒有返回其中的內容（嘗試return keyPressed(holder); - 或者只是將keyPressed函數的代碼移動到setupSearchField ，因為它似乎對我來說，將它作為一個單獨的功能是毫無意義的）。

Answer 2

當只有一個文本輸入時，無論您的按鈕（如果有）是否具有type =“submit”，都會發生這種情況。 它在這里記錄。 http://www.w3.org/MarkUp/html-spec/html-spec_8.html#SEC8.2因此，正如之前其他人所建議的那樣，您必須簡單地停止此默認行為。

Answer 3

您的搜索字段是否在元素內？ 然后點擊'enter'將一個提交事件激活到表單元素。

在這種情況下，您可以通過在表單元素上定義onsubmit來處理過濾。

<form id="searchForm">
    <input type="text" name="search" />
</form>
<script>
    document.getElementById('searchForm').onsubmit = function() {
        var searchValue = this.search.value;
        // process
        return false;
    }
</script>

也許這樣的事情。

Answer 4

只需將以下JavaScript代碼添加到Visualforce頁面：

<script type='text/javascript'>
function stopRKey(evt) 
{
   var evt=(evt) ? evt : ((event) ? event : null);
   var node=(evt.target)?evt.target:((evt.srcElement)?evt.srcElement:null);
   if ((evt.keyCode == 13) && (node.type=="text")) {return false;}
}

document.onkeypress = stopRKey;
</script>