【问题标题】:How to press "Enter" to redirect to other page?如何按“Enter”重定向到其他页面?
【发布时间】:2015-02-07 03:26:58
【问题描述】:

我正在研究搜索功能,我做得很好以获得我想要的结果。我有一个搜索文本字段,可以让用户键入值,JavaScript 将帮助我获取文本字段值的相关数据。现在我希望我的文本字段可以在我使用“Enter”按钮按下它时起作用。一旦我按下“Enter”按钮,它会将我重定向到一个新页面,该页面显示我在文本字段中键入的关键字的所有相关数据。

这是我在 HTML 页面中的 JavaScript 和 HTML 代码:

<script>
$(document).ready(function() {  

    // Icon Click Focus
    $('div.icon').click(function(){
        $('input#search').focus();
    });

    // Live Search
    // On Search Submit and Get Results
    function search() {
        var query_value = $('input#search').val();
        $('b#search-string').html(query_value);
        if(query_value !== ''){
            $.ajax({
                type: "POST",
                url: "search.php",
                data: { query: query_value },
                cache: false,
                success: function(html){
                    $("ul#results").html(html);
                }
            });
        }return false;    
    }

    $("input#search").live("keyup", function(e) {
        // Set Timeout
        clearTimeout($.data(this, 'timer'));

        // Set Search String
        var search_string = $(this).val();

        // Do Search
        if (search_string == '') {
            $("ul#results").fadeOut();
            $('h4#results-text').fadeOut();
        }else{
            $("ul#results").fadeIn();
            $('h4#results-text').fadeIn();
            $(this).data('timer', setTimeout(search, 0));
        };
    });

});
</script>

SEARCH<input type="text" id="search" autocomplete="off">
                    <ul id="results" style="display:none"></ul>

在文本中键入值后,JavaScript 将调用 search.php 以获取所有相关数据。但我无法单击文本字段来显示所有值。希望你们能给我一个解决方案来解决它。提前致谢。

【问题讨论】:

  • 我无法理解您的问题。您是否正在尝试制作类似于 Google 搜索的表单?
  • 我有一个文本字段来填写值,我想要的是当我单击“Enter”按钮时文本字段可以提交到其他页面。希望这能让你更清楚。
  • "live()" 已弃用,改用"on()"
  • 你用的是什么版本的jQuery?
  • 听起来好像您只需要一个常规的form 元素来提交您的查询。

标签: javascript php jquery html


【解决方案1】:

试试这个并使用 jQuery 1.8 或最低版本。

$("input#search").live("keyup", function(e)
        if(e.which == 13) {
            //perform your operations
        }
    });

【讨论】:

    【解决方案2】:

    您可以将其设为表单,以便在用户按 Enter 时提交。

    <form method="get" action="search page.php" onsubmit="return validate();">
        SEARCH<input type="text" id="search" autocomplete="off">
        <ul id="results" style="display:none"></ul>
    </form>
    
    <script type="text/JavaScript">
    function validate() {
        //If the form value is "" (nothing)
        if (document.getElementById("search").value == "") {
            return false; //Stop the form from submitting
        }
        return true;
    }
    </script>
    

    【讨论】:

    • 字段内没有值时如何使其不可点击?
    • 我更新了它,如果里面没有任何东西,表格就不会发送。
    猜你喜欢
    • 1970-01-01
    • 2020-07-28
    • 2017-05-01
    • 2012-03-16
    • 2014-05-16
    • 2018-07-10
    • 2018-03-11
    相关资源
    最近更新 更多