0

我有一个简短的 jQuery 脚本，可以images:在用户单击链接时将文本添加到搜索框中。但是，如果用户单击不同的选项卡而不是他们键入的搜索将被删除。我想保留用户输入的内容（如果他们输入了任何内容），它将始终位于:. 可以删除之前的任何内容。

我该怎么做呢？

我目前的 jQuery 是：

$(document).ready(function(){
    $("#navigation a").click(function(){
        $("#search").val($(this).attr("id")+': ').focus();
        return false
    });
});

我的 HTML 是：

<ul id="navigation">
    <li><a href="#" id="images">Images</a></li>
    <li><a href="#" id="videos">Videos</a></li>
    <li><a href="#" id="articles">News</a></li>
    <li><a href="#" id="weather">Weather</a></li>
</ul>

<input type="text" id="search">

您可以在 JSFiddle 上看到当前代码的工作示例：http: //jsfiddle.net/Zusnw/

4

2 回答 2

0

我建议：

$("#navigation a").click(function(){
    var search = $('#search'),
        curVal = $('#search').val(),
        i = curVal.indexOf(':'),
        newVal = i !== -1 ? curVal.substring(i) : ': ' + curVal;
    $('#search').focus().val(this.id + newVal);
});

JS 小提琴演示。

于 2013-02-24T15:57:18.697 回答
0

这是你想要的修复。

$(document).ready(function(){
    $("#navigation a").click(function(){
        var searchBox = $("#search");
        var searchBoxVal = searchBox.val();     
        var newVal = '';
        if(searchBoxVal.indexOf(":") > -1)
        {
            // get the content after the colon...
            newVal = this.id + ":" +searchBoxVal.substring(searchBoxVal.indexOf(":")+1);
        }
        else
        {
            newVal = this.id + ": ";
            if(searchBoxVal.length > 0) 
            {
                // if colon not found but user has type anythings...
                newVal += searchBoxVal;
            }
        }
        searchBox.val(newVal);
        searchBox.focus();
        return false;
    });
});
于 2013-02-24T16:00:13.060 回答