Question

我有一个脚本，在输入字段中输入内容后显示搜索结果。我想通过使文本粗体来模仿Google，这类似于输入值。

我试过了：

$(input).live('keyup', function(){
    var makeBold = $('#Results').css("font-weight","bold");

    if ($(input).val() == $('#Results').html()) {   
        makeBold();
    }
});

问题是现在一切都是粗体而不仅仅是匹配值。如何引用该值并将其与结果相关联？

Answer 1

您需要将结果的匹配部分包装在<span style='font-weight:bold;'>标记中。您可以使用javascript replace()函数轻松完成此操作。

Answer 2

您的问题是，在定义makeBold时，您正在执行“变为粗体”。 css()分配给makeBold的结果，它不是函数。

var makeBold = $('#Results').css("font-weight","bold");

如果您想要一个功能，请为makeBold指定一个匿名的。

var makeBold = function() { $('#Results').css("font-weight","bold"); }

Answer 3

这里有一些你没有展示的代码。我不确定您的自动完成结果会发生什么。从我在这里显示的内容来看，我所知道的是你有一个输入框和一个结果容器，我只能假设在键入时（在你的函数中没有显示）得到结果。

无论您是在Javascript上设置整个#Results容器的CSS属性。如果还有其他结果，那么他们也会有一个强大的font-weight。也许在自动完成的结果周围添加span标记，并使用#Results span作为选择器。

编辑：假设您已经打印出自动完成功能建议，那么为了加粗自动完成结果的类型部分，我要做的是通过比较其键盘上的子串 - 然后将它们包裹在一个强大的标签中。

Answer 4

使用@Michael Mior提供的链接工作了

var makeBold = $(input).val();
$('#Results').highlight(makeBold);

.highlight的部分是指你可以用粗体或其他方式改变的css。

使用Jquery模仿Google粗体字体

4 个答案: