创建一个搜索栏,在栏中输入关键词可以快速地搜索到符合要求的邮件地址,类似于Gmail中的“发送至”搜索栏。代码示例:
.send-to-search {
height: 30px;
width: 200px;
border: 1px solid #d9d9d9;
border-radius: 4px;
padding: 6px 10px;
font-size: 14px;
outline: none;
}
// 监听输入框变化
const inputElement = document.querySelector('.send-to-search');
inputElement.addEventListener('input', function() {
const value = inputElement.value.toLowerCase();
// 过滤邮件地址列表
const filteredEmails = emails.filter(function(email) {
return email.to.toLowerCase().includes(value);
});
// 渲染邮件地址列表
renderEmailList(filteredEmails);
});