将jquery与css结合使用" area-tag"

时间:2014-01-12 14:54:44

标签: javascript jquery html css area

我创建了这个example

如您所见,我使用区域标记将图像分成四个样方。

第一个quadrat有数据名:abc,第二个quadrat有数据名:def,

第三个quadrat有数据名:ghi,第四个quadrat有数据名:jkl。

此外,还有一个搜索输入。我想要你问的是,是否可以在输入中输入任何内容并查看输入是否与数据名称之一匹配。

情景:

我在input =>中输入“a”在其数据名称的开头有“a”的每个区域都应保持不变,但其他区域的不透明度应为“1”。这是否可以使用keyup-event?例如:

$(document).ready(function () {
    $("#searchfield").keyup(function() {
        var input = $.("#searchfield").val();
        $( "area[data-name^=' + input + ']" ).css( "opacity" , "1" );
    });
});

如何让jquery搜索html?我知道如何做ajax等..但是在网站的源代码中进行jquery搜索?

我遵循了这个article,但没有结果:

需要你的帮助

问候

1 个答案:

答案 0 :(得分:0)

输入是可变的,因此您需要将其放在双引号之外:

$( "area[data-name^='" + input + "']" ).css( "opacity" , "1" );

还可以更好地使用:

var input = $(this).val();