0

有一个问题，我即将在我的网站上重建搜索功能，但我无法让它按我想要的方式工作。问题是当进入带有查询字符串“q”的页面时，我希望填写搜索框并开始搜索。我已经来回测试过，但无法让它工作。如果您在搜索框中键入并等待 500 毫秒，则搜索有效，但在搜索框自动填充后我不管理触发呼叫。

这是没有查询字符串功能的代码。

<script type="text/javascript">
$(document).ready(function () { // 1
    jQuery("abbr.timeago").timeago();
    $("tr:even").addClass("even");
    $("tr:odd").addClass("odd");
    var q = getQuerystring('q', '');

    $("input#q").val(q);
}); // 1

$(document).ready(
    function () { // 1
        // Hide update box  
        $('#updater').hide();

        var retrieveData = function (path, query, funStart, funEnd, funHandleData) 
        { // 2
            // for displaying updater 
            funStart();
            // retrieve JSON result 
            $.getJSON(
                path,
                { name: query },
                function (data) 
                { // 3
                    // handle incoming data 
                    funHandleData(data);
                    // for hiding updater 
                    funEnd();
                } // 3
        ); // 2
    }; // 1

    $(function () 
    { // 1
        var timer;

        $("#q").keyup(function () 
        { // 2
            clearTimeout(timer);
            var ms = 500; // milliseconds
            var val = this.value;
            timer = setTimeout(
            function () 
            { // 3
                retrieveData('/Search/FindPaste/', $('#q')[0].value,
                    function () { $('#updater').show(); },
                    function () { $('#updater').hide(); },
                    function (data) 
                    { // 4
                        $('#codelist > tr').remove();
                        for (s in data) 
                        { // 5
                            var code = data[s];
                            var d1 = new Date(parseInt(code.Created.substr(6)));

                            $('#codelist').append('<tr><td><a href="http://www.pastebucket.com/' + code.CodeID + '">' + code.Title + '</a></td><td><abbr class="timeago" title="' + d1.toString('yyyy-MM-dd HH:mm:ss') + '">' + d1.toString('yyyy-MM-dd HH:mm:ss') + '</abbr></td><td>' + code.Syntax + '</td><td>' + code.Views + '</td><td><a href="http://www.pastebucket.com/User/' + code.Username + '">' + code.Username + '</a></td></tr>');
                            jQuery("abbr.timeago").timeago();
                            $("tr:even").addClass("even");
                            $("tr:odd").addClass("odd");
                        } // 5
                    }) // 4
                }, ms); // 3
            }); // 2
        }); // 1
    }

);

function getQuerystring(key, default_) 
{
    if (default_ == null) default_ = "";
    key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
    var qs = regex.exec(window.location.href);
    if (qs == null)
        return default_;
    else
        return qs[1];
}

解决方案！

  <script type="text/javascript">
    $(document).ready(function () { // 1

    }); // 1

    $(document).ready(function () {
        // Hide update box  
        $('#updater').hide();

        var retrieveData = function (path, query, funStart, funEnd, funHandleData) { // 2
            // for displaying updater 
            funStart();
            // retrieve JSON result 
            $.getJSON(
                path,
                { name: query },
                function (data) { // 3
                    // handle incoming data 
                    funHandleData(data);
                    // for hiding updater 
                    funEnd();
                } 
            ); 
        }; 

        var timer;

        $("#q").keyup(function () { // 2
            clearTimeout(timer);
            var ms = 500; // milliseconds
            var val = this.value;
            timer = setTimeout(
        function () { // 3
            retrieveData('/Search/FindPaste/', $('#q')[0].value,
                function () { $('#updater').show(); },
                function () { $('#updater').hide(); },
                function (data) { // 4
                    $('#codelist > tr').remove();
                    for (s in data) { // 5
                        var code = data[s];
                        var d1 = new Date(parseInt(code.Created.substr(6)));

                        $('#codelist').append('<tr><td><a href="http://www.pastebucket.com/' + code.CodeID + '">' + code.Title + '</a></td><td><abbr class="timeago" title="' + d1.toString('yyyy-MM-dd HH:mm:ss') + '">' + d1.toString('yyyy-MM-dd HH:mm:ss') + '</abbr></td><td>' + code.Syntax + '</td><td>' + code.Views + '</td><td><a href="http://www.pastebucket.com/User/' + code.Username + '">' + code.Username + '</a></td></tr>');
                        jQuery("abbr.timeago").timeago();
                        $("tr:even").addClass("even");
                        $("tr:odd").addClass("odd");
                    } // 5
                }) // 4
        }, ms); // 3
        }); // 2

        jQuery("abbr.timeago").timeago();
        $("tr:even").addClass("even");
        $("tr:odd").addClass("odd");
        var q = getQuerystring('q', '');

        $('input#q').val(q).keyup()

    }
);

function getQuerystring(key, default_) {
    if (default_ == null) default_ = "";
    key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
    var qs = regex.exec(window.location.href);
    if (qs == null)
        return default_;
    else
        return qs[1];
}


</script>
4

1 回答 1

1

只需填充框并触发框change()上的事件。

$('input#q').val(q).change();

编辑：或者在你的情况下，keyup事件：$('input#q').val(q).keyup()

于 2012-12-17T20:30:10.527 回答