<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>字符搜索</title>
</head>
<body><input type="text" id="findinput"><ul><li>人生到处知何似</li><li>应似飞鸿踏雪泥</li><li>泥上偶然留指抓</li><li>鸿飞那复计东西</li></ul><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript">$('#findinput').keydown(function(event) {// 回车搜索if (event.keyCode == 13) {var keyword = $(this).val();var liNode = $('li');liNode.hide(); //将原有的内容隐藏 liNode.filter(":Contains(" + keyword + ")").fadeIn(200); //将含有keyword的li进行渐变显示//查找出的第一个元素点击选中liNode.each(function(n, item) {if (!liNode.eq(n).is(':hidden')) {item.click();return false;}});}})// 元素点击事件$('li').on('click', function() {console.log($(this).index());});</script>
</body>
</html>
本文发布于:2024-02-04 23:25:09,感谢您对本站的认可!
本文链接:https://www.4u4v.net/it/170718769360714.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
留言与评论(共有 0 条评论) |