Question

我有一个jQuery搜索脚本，用于查询PHP文件，然后将结果解析为HTML div。如果没有活动的查询，则会自动选择文本框，但是当查询处于活动状态时，我希望不会自动选择该查询。目前我只能禁用不是我想要的文本框。我该如何解决这个问题？

我的jQuery脚本是：

$(document).ready(function(){
    $('[id^=type_]').click(function(){
        type=this.id.replace('type_','');
        $('[id^=type_]').removeClass('selected');
        $('#type_'+type).addClass('selected');
        return false;
    });
    $('#type_search').click();
    $('#query').keyup(function(){
        var query=$(this).val();
        var url='/'+type+'/'+query+'/';
        window.location.hash=''+type+'/'+query+'/';
        document.title=$(this).val()+' - My Search';
        $('#results').show();
        if(query==''){
            window.location.hash='';
            document.title='My Search';
            $('#results').hide();
        }
        $.ajax({
            type:'GET',
            url:url,
            dataType:'html',
            beforeSend:function(){
                $('#query').prop('disabled',true);
            },
            success:function(results){
                $('#results').html(results);
            }
        });
    });
    if(window.location.hash.indexOf('#'+type+'/')==0){
        query=window.location.hash.replace('#'+type+'/','').replace('/','');
        $('#query').val(decodeURIComponent(query)).keyup();
    }
    $('#query').focus();
});

Answer 1

您可以使用$('#query').blur()删除焦点（http://api.jquery.com/blur/）

更新

如果您希望发送ajax请求（并且文本框失去焦点），只有当您认为用户有暂停键入时，您才能开始更新keyup事件的超时并且仅在发送时发送ajax请求火灾。通过这种方式，您可以更安全地模糊文本框：

var queryPauseTimeout;
.
.
.
.

$('#query').keyup(function(){
    if (queryPauseTimeout)
       clearTimeout(queryPauseTimeout);

    queryPauseTimeout = setTimeout(function() {
    var query=$('#query').val();
    var url='/'+type+'/'+query+'/';
    window.location.hash=''+type+'/'+query+'/';
    document.title=$('#query').val()+' - My Search';
    $('#results').show();
    if(query==''){
        window.location.hash='';
        document.title='My Search';
        $('#results').hide();
    }
    $.ajax({
        type:'GET',
        url:url,
        dataType:'html',
        beforeSend:function(){
            $('#query').prop('disabled',true);
        },
        success:function(results){
            $('#results').html(results);
        }
    });
,5000);

。。。

Answer 2

这是我刚才发表的评论的“答案”版本。如果您使用$('#query').val().length，则可以在文本框中获取值的长度，如下所示：

var textlength = $('#query').val().length;

if(textlength <= 0)
    $('#query').focus();
else
    $('#query').blur();

我不认为.blur();确实是必需的，但它也不会受到伤害。

编辑＃1：好的，我假设您有一个页面，其中有一个搜索框和一个div - 标记，其中存储了您的项目（由AJaX执行）。另外我假设当你点击F5（然后重新加载整个页面）时，你的页面将重新加载，并且搜索框中已经存在数据（通过PHP或更早的JavaScript语句）。然后，您可以使用我在上面发布的代码替换您当前的$('#query').focus();。

编辑＃2：我刚刚重新阅读了您的代码，我认为用我的代码替换$('#query').focus();应该完全符合您的要求。

取消选择jQuery中的文本框

2 个答案:

更新