大家好！
今天要实作的是表单的输入提示。
我们进入今天的主题吧！
const input = Felix('input[id]');
const status = [].slice.call(input).reduce(function (a, v) {
return (a[v] = true, a);
}, {});
input.on('focus', event);
input.on('blur', event);
function check(type, message) {
if (typeof type !== 'number' || type < 0 || type > 3) return;
const checker = Felix('#checker')[0];
const types = [null, 'normal', 'marked', 'urgent'];
checker.classList.remove(types[1], types[2], types[3]);
if (type === 0) return;
checker.classList.add(types[type]);
checker.textContent = message;
}
function event(e) {
if (e.type === 'blur') return check(0);
if (status[e.currentTarget.id]) return check(1);
}
<body>
<!-- ... -->
<div id="checker"></div>
</body>
范例连结制作中。
差不多也到尾声了。
如果对文章有任何疑问，欢迎於下方提问和建议！
我是 Felix，我们明天再见！
<<: [从0到1] C#小乳牛 练成基础程序逻辑 正确打开方式 - 观看SOP
>>: Day 20：AWS 是什麽？30天从动漫/影视作品看AWS服务应用 -《龙与雀斑公主》
Node.js 版本间的差异使得有些专案需要使用特定的版本才能正常运作，因此各专案间需要来回的切换 ...
在前面章节中，我们已经写过 2 个 hello world作业，接下来要将 hello world...
因私人因素欧吉桑有一段时间没发文了，不知道有没有人期待我的新文章呢？ 今天，我想跟大家分享的主题是【...
今日目标 很多时候我们会需要搜集些不同的资料。像是 Marketing 在做大规模但针对不同组织的调...
今天想介绍其他常用的dialog和之前介绍过一般的dialog很像 只是有了一些变化 但都还蛮实用的...