1

我对 jQuery 中的 .val() 方法如何处理空格（如果它根本是 jQuery 问题）感到困惑。

我的示例是使用我正在慢慢开发的 AJAX 建议框功能。它使用 Codeigniter 作为框架。

我有这个 jQuery 代码：

$(document).ready(function(){
    $("#suggestbox").hide();
    $("#searchboxinput").live("keyup", function(){
        if ($("#searchboxinput").val().length==0){
            $("#suggestbox").fadeOut(100);
        }else{
            $("#suggestbox").fadeIn(100);
            $("#sugresultcontain").load('http://localhost/ajaxtest/ajaxhandle/suggest/'+$("#searchboxinput").val()+' #loadsuggest');
        };
    });
});

'#suggestboxinput' 是一个文本输入，如下所示：

<div id="content" class="clear">
    <div id="searchwrap" class="clear">
        <div id="searchbox" class="float-left"><input id="searchboxinput" name="" value="" type="text"></div>
        <div id="searchbutton" class="float-right"><input id="searchbuttoninput" name="" type="button" value="Go"></div>
    </div>
    <div id="suggestbox" class="clear">
        <div id="suggesthead">Suggestions:</div>
        <div id="sugresultcontain"></div>
    </div>
</div>

然后我有（使用代码点火器）一个处理 .load() 的方法，如图所示：

public function suggest($q=''){

        $suggest = $this->ajax_handle->suggest();

        for($i=0; $i<count($suggest); $i++){
            $db[$i] = $suggest[$i]['firstname'].' '.$suggest[$i]['lastname'];
        }

        if(strlen($q)>0){
            $sugstr = '';
            $e = 0;

            for($f=0; $f<count($db); $f++){
                if (strtolower($q)==strtolower(substr($db[$f],0,strlen($q)))){
                    $sugresult[$e] = $db[$f];
                    $e++;
                }
            }

            if(isset($sugresult)){
                $data['sugresult'] = $sugresult;
                $this->load->view('ajaxref/suggest', $data);
            }else{
                $this->load->view('ajaxref/suggest');
            }
        }else{
            $this->load->view('ajaxref/suggest');
        }
    }

这几乎可以按预期工作，如果我加载页面然后使用数据库中的名称显示的文本输入（根据文本字段）。如果我输入名字，它会正常工作，并且无论我在字段后放置多少空格都会继续显示（这是完美的）。

然而，问题在于即使只在一个空格（Dominic Sore）或什至只在第一个字母或姓氏（Dominic S）之后输入姓氏。建议框中不显示名称。

我读过在输入框中使用“+”符号会起作用。我对其进行了测试，它确实有效（Dominic+Sore 在建议框中输出 Dominic Sore）。不过可以理解的是，我不能让用户为他们想要使用的每个空间都输入一个“+”。

所以我只是想知道我该如何处理？我已经阅读了很多，但我找不到解决方案。

谢谢。

4

3 回答 3

2

鉴于 using有效，在提交变量进行匹配之前+，可能值得使用对变量进行 url 编码，以提供：encodeURIComponent()

$("#sugresultcontain").load('http://localhost/ajaxtest/ajaxhandle/suggest/'+encodeURIComponent($("#searchboxinput").val())+' #loadsuggest');

或者，您可以进行简单的替换：

$('#searchboxinput').val().replace(/\w/g,'+');

但是encodeURIComponent更可靠，并且会正确编码撇号（O'Neill）以及空格字符。

参考：

于 2012-07-09T21:32:51.263 回答
0

尝试$.trim方法：

删除字符串开头和结尾的空格。

var txt = $.trim($("#searchboxinput").val()).replace(' ', '+')
于 2012-07-09T21:33:54.047 回答
0

如果我理解正确，问题就出在这条线上

$("#sugresultcontain").load('http://localhost/ajaxtest/ajaxhandle/suggest/'+$("#searchboxinput").val()+' #loadsuggest');

这样想，你是通过连接几个部分来制作一个字符串。假设您的输入" something"中有，这意味着您正在加载：

'http://localhost/ajaxtest/ajaxhandle/suggest/    something #loadsuggest'

这显然不会按预期工作。您需要做的是修剪输入中的值，最好确保它仅包含有效的 url 字符（否则输入中的 / 或 ? 可能会出于同样的原因破坏查询）

沿着这些思路：

var suggest_url_part = encodeURIComponent($("#searchboxinput").val().trim());
if (suggest_url_part.length) {    
  $("#sugresultcontain").load('http://localhost/ajaxtest/ajaxhandle/suggest/' + suggest_url_part + '#loadsuggest');
}
于 2012-07-09T21:37:10.140 回答