Question

我正在尝试使用list.js方法从图库中搜索某些结果。目前，搜索栏正在使用图像源链接来搜索结果。这是我的代码：

HTML

<div id="users">
    <input class="search" placeholder="Search" />
        <ul class="list">

            <!-- Apple -->
            <li>
                <a href="#" class="name"><img src="img/Apple.jpg"></a>
            </li>

            <!-- Orange -->
            <li>
                <a href="#" class="name"><other src="img/Orange.jpg"></a>
            </li>

            <!-- Lemon -->
            <li>
                <a href="#"><img src="img/Lemon.jpg"></a>
            </li>

            <!-- Banana -->
            <li>
                <a href="#"><img src="other/Banana.jpg"></a>
            </li>

的Javascript

var options = {
    valueNames: [ 'name' ]
};

var userList = new List('users', options);

当我输入时，让我们说“img”，它在搜索结果中给了我Lemon，Orange和Apple，我不想发生这种情况。我不知道该怎么办才能使搜索栏给出实际名称（Just Apple，Banana，Orange，Lemon）的结果，而不是整个图像源链接。

Answer 1

我认为这种情况正在发生，因为您已将类名添加为搜索源，但带有类名的选项卡是包含图像本身的链接，尝试将图像与链接分开或向图像代码添加单独的类我想说的是：

<a class="x"> ....... </a>

当你搜索时，它会返回标签内的任何内容（.....）所以你需要将图像部分移出它或创建一个新的可搜索选项卡试试这个：

<a href="#" ><img src="img/Apple.jpg"></a> <a class="name"> Image_Name </a>

或

 <a class="name">Image_Name </a> <img src="img/Apple.jpg">

搜索栏正在搜索图像源链接，如何让它搜索名称？

1 个答案: