0

我有一些问题，

我创建了使用 JSON 数组中的数据的搜索框。如果用户单击按钮，此搜索框可以正常工作，但是当按下回车时，该功能不起作用。

这是单击按钮的语法

   $("#btnsearch").click(function() {
        $("#divContent").hide("slow");
        $("#posting").html("");
        //show the div section
        $("#divContent").show("slow", function(){
            $("#divPage").hide("slow");       
            //getting value from searchbox
            valobj = $('#search_box').val();
            if(valobj == ""){
                $("#posting").append("Please Insert Keyword to Search!");
            } else {
            //execute data from database.
            $.getJSON("stitle.php", { title : valobj }, function(data,result){
                //show result from database
                if(data.content == ""){
                    $("#posting").append("Sorry, your search result is not found!");
                } else {
                    $.each(data.content, function(index, value) {
                        var li = $("<li><h3></h3><p></p></li>");
                        $("#posting").append(li);
                        $("h3",li).html("<a href='post.php?id="+ value.id +"'>" + value.title + "</a>");
                        $("p",li).text(value.intro_text);           
                    });

                    $(function(){
                        $("div.holder").jPages({
                            containerID : "posting",
                            perPage: 5
                        });
                        $(".holder").show();
                    });
                }   //end if 
            }, 'JSON'); //end show result
          } // show result if keyword is present 
        }); //end show div section
        $("#leftregion").hide();
        $("#rightregion").hide();
    }); //end click function

如果用户按下回车键，我想创建这个方法。我已经读过，jquery 需要使用 keypressed 方法。

    $(document).on("keypress", "#search_box", function(e) {
        var valobj = this.value;
        if(e.which == 13){
            $("#divContent").show("slow");
            $("#posting").html("");   
             if(valobj == ""){
                $("#posting").append("Please Insert Keyword to Search!");
            } else {
                //do the same function like code above 
                $.getJSON("stitle.php", { title : valobj }, function(data.......
            }
        }
    });

但是该方法不起作用，有什么建议吗？

谢谢你。

更新

我把代码改成这个

 $("#search_box").keypress(function(e) {
        valobj = $('#search_box').val();
        if(e.which == 13){
            $("#divContent").show("slow",function(){
            $("#posting").html("");   
            if(valobj == ""){
                $("#posting").append("Please Insert Keyword to Search!");
            } else {
                //do the same function like code above 
               $.getJSON("stitle.php", { title : valobj }, function(data,result){

                   $.each(data.content, function(index, value) {
                        var li = $("<li><h3></h3><p></p></li>");
                        $("#posting").append(li);
                        $("h3",li).html("<a href='post.php?id="+ value.id +"'>" + value.title + "</a>");
                        $("p",li).text(value.intro_text);           
                    });

                    $(function(){
                        $("div.holder").jPages({
                            containerID : "posting",
                            perPage: 5
                        });
                        $(".holder").show();
                    });
               }, 'JSON'); //end get JSON function
            }
         }); //end show function
       }
    });

但它不起作用。我错过了什么吗？有什么建议吗？

谢谢你。

4

1 回答 1

0

您的函数如下所示。因此，在您的文档就绪事件中，您将使用 .on() 将按键事件处理程序绑定到 search_box：

$(document).ready(function(){

     $(document).on("keypress", "#search_box", function(e) {
        valobj = $('#search_box').val();
        if(e.which == 13){
            $("#divContent").show("slow",function(){
            $("#posting").html("");   
            if(valobj == ""){
                $("#posting").append("Please Insert Keyword to Search!");
            } else {
                //do the same function like code above 
               $.getJSON("stitle.php", { title : valobj }, function(data,result){

                   $.each(data.content, function(index, value) {
                        var li = $("<li><h3></h3><p></p></li>");
                        $("#posting").append(li);
                        $("h3",li).html("<a href='post.php?id="+ value.id +"'>" + value.title + "</a>");
                        $("p",li).text(value.intro_text);           
                    });

                    $(function(){
                        $("div.holder").jPages({
                            containerID : "posting",
                            perPage: 5
                        });
                        $(".holder").show();
                    });
               }, 'JSON'); //end get JSON function
            }
         }); //end show function
       }
    });

})

编辑：根据下面的讨论更新答案。

于 2013-06-20T03:41:54.907 回答