使用GET請求提交表單到頁面本身

我需要的是當用戶在搜索框中鍵入他的查詢時。使用GET請求提交表單到頁面本身

<form class="navbar-search pull-left"> 
     <input type="text" autocomplete="off" autofocus id="query" class="search-query search_input" placeholder="Type your query..."> 
    </form>

我沒有按鈕來提交表單。我希望在用戶按下Enter鍵時提交表單。而當用戶按Enter鍵時，我希望查詢顯示在URL中。像提交

http://example.come/

與之前的URL當用戶輸入他的文字，並按下回車鍵。我想查詢顯示在這樣的URL中

http://example.come/#query

沒有重新加載整個。這是possile使用Javascript或jquery或任何更容易。

編輯：這是我試過的 window.location.hash = get_query;

if (get_query.length != 0) { 
     $("#query").val(get_query); 
    $('.search_input').trigger('keyup'); // This is the Event which triggers 
    }

來源

2012-04-01 Narendra Rajput

是的，這是可能的。閱讀文檔並嘗試一些內容。 – 2012-04-01 11:32:56

老兄我試了一些技巧！但我真的很喜歡它！ – 2012-04-01 11:33:49

如果沒有提交按鈕，某些瀏覽器將不會提交表單。然而，看看這個其他Stackoverflow線程：http://stackoverflow.com/questions/699065/submitting-a-form-on-enter-with-jquery – 2012-04-01 11:36:04

添加A型輸入提交其隱藏支持按ENTER鍵提交元素：

<form id="form1" class="navbar-search pull-left" action=""> 
    <input type="text" autocomplete="off" autofocus id="query" class="search-query search_input" placeholder="Type your query..."> 
    <input type="submit" style="display: none;"> 
</form>

在表單提交更改的散列與輸入的值：

$('#form1').submit(function() { 
    window.location.hash = '#' + $("#query").val(); 
    return false; 
});

另見my example和associated jsfiddle。

來源

2012-04-01 12:12:40 scessor

如果我刪除了「return false」語句，導致我在.submit（function（）？ – 2012-04-01 13:10:37

之後有一個很長的語句如果在提交處理程序結束時沒有返回false，則表單操作將是（因爲它是空的瀏覽器將重新加載頁面）。返回'false'的替代方法是設置'action'屬性：'action =「javascript：void（0）;」';那麼你可以刪除'return false;'。 – scessor 2012-04-01 13:17:35

另請參閱[更新示例]（http://jsfiddle.net/LjYYK/1/show/）與[關聯的jsfiddle]（http://jsfiddle.net/LjYYK/1/）。 – scessor 2012-04-01 13:19:54

使用GET請求提交表單到頁面本身

回答

相關問題