Javascript 搜索函数未返回结果

功能：

用户可以对图像源进行搜索，当单击“搜索”时，将返回正确的图像源

我所做的：

已创建搜索输入框，当用户单击输入框时，屏幕上将显示一个键盘（淡入）。用户可以点击键盘输入字符。完成后，用户可以单击搜索按钮开始搜索，也可以在将字符写入文本搜索框时开始搜索

已附上代码供您阅读：

var shift=false，
capslock=false；
var$write；
var slideDuration=1200；
$（函数（）{
$（“#搜索字段”）.focus（函数（）{
$write=$（“#搜索字段”）；
$（“#键盘”）.show（）；
});
//搜索图像品牌功能
$（“#SearchField”）.keyup（函数（）{
var userInput=$（this.val（）.toLowerCase（）；
console.log（“此处”）；
$（“#列出img”）。每个（函数（）{
$this=$（this），
imageName=$this.attr（'src'）.split（'/'）；//按'/'分割src
//获取最后一部分（文件名）
imageName=imageName.pop（）；
//移除扩展
imageName=imageName.split（'.'）[0]；
//显示具有匹配文件名的图像
$this.toggle（imageName.indexOf（userInput）>=0）；
});
});
});
$（“#搜索字段”）。单击（函数（）{
$（“#搜索键盘”）.fadeIn({
持续时间：幻灯片教学，
队列：false，
完成：函数（）{
$（'#搜索键盘li'）。关闭（'click'）。打开（'click'，函数（）{
控制台日志（“单击”）；
空闲时间=0；
变量$this=$（this），
character=$this.html（）；//如果是小写字母，则此变量不会发生任何变化
console.log（字符）；
//换档键
if（$this.hasClass（'left-shift'）| |$this.hasClass（'right-shift'））{
$（'.letter'）.toggleClass（'大写'）；
$（'.symbol span'）.toggle（）；
shift=（shift==真）？false:真；
capslock=false；
返回false；
}
//帽锁
if（$this.hasClass（'capslock'））{
$（'.letter'）.toggleClass（'大写'）；
capslock=真；
返回false；
}
//删除
if（$this.hasClass（'delete'））{
var html=$write.val（）；
$write.val（html.substr（0，html.length-1））；
返回false；
}
//清楚的
if（$this.hasClass（'clear'））{
var html=$write.val（）；
$write.val（“”）；
返回false；
}
//特殊字符
如果（$this.hasClass（'symbol'））字符=$（'span:visible'，$this.html（）；
if（$this.hasClass（'space'））字符=“”；
if（$this.hasClass（'tab'））character=“\t”；
if（$this.hasClass（'return'））character=“\n”；
//大写字母
if（$this.hasClass（'uppercase'））character=character.toUpperCase（）；
//单击键后删除shift。
如果（移位===真）{
$（'.symbol span'）.toggle（）；
if（capslock==false）$（'.letter'）.toggleClass（'大写'）；
移位=假；
}
//添加角色
$write.val（$write.val（）+字符）；
});
}
});
})
//搜索图像品牌功能
函数搜索（）{
//var userInput=$（this.val（）.toLowerCase（）；
console.log（“此处”）；
$（“#列出img”）。每个（函数（）{
$this=$（this），
imageName=$this.attr（'src'）.split（'/'）；//按'/'分割src
//获取最后一部分（文件名）
imageName=imageName.pop（）；
//移除扩展
imageName=imageName.split（'.'）[0]；
//显示具有匹配文件名的图像
$this.toggle（imageName.indexOf（userInput）>=0）；
});
}

/*键盘CSS*/
.键盘{
位置：绝对位置；
保证金：0；
填充：0；
列表样式：无；
}
李健{
字体大小：20px；
浮动：左；
保证金：2；
宽度：65px；
高度：50px；
线高：50px；
文本对齐：居中；
颜色：#000；
背景：#ffffff；
边框：1px实心#000；
-moz边界半径：5px；
列表样式：无；
-webkit边界半径：5px；
}
卡普斯洛克先生，
.选项卡，
.左移{
清除：左；
}
.keyboard.tab，
.键盘.删除{
宽度：165px；
}
.键盘.卡普斯洛克{
宽度：101px；
}
.键盘.返回{
宽度：101px；
}
.键盘.左移{
宽度：165px；
}
.键盘.右移{
宽度：165px；
}
.最后一项{
右边距：0；
}
.大写字母{
文本转换：大写；
}
.键盘.空格{
清除：左；
宽度：685px；
}
.在{
显示：无；
}
.键盘李：悬停{
位置：相对位置；
顶部：1px；
左：1px；
边框颜色：#E5；
光标：指针；
}
#搜寻{
位置：绝对位置；
顶部：750px；
左：800px；
z指数：100；
大纲：0；
边界：0；
背景：透明；
}

1
2
3
4
5
6
7
8
9
0
q
w
e
r
t
y
u
i
o
p
a
s
d
f
g
$('body').on('keyup','#SearchField',function(){
//do the next
});

// Add the character
/* just after adding character trigger kayup event manually here */
$write.val($write.val() + character).trigger('keyup');