请老师帮忙看一下,总觉得代码不够优化
来源:4-3 编程练习
慕前端2064318
2019-07-19 11:47:16
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>习题</title>
</head>
<body>
<input type="text" value="" /><span></span>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>
//此处写代码
$('input').focus(function() {
$('span').text('请输入用户名');
$('input').css({ border: 'none' });
});
$('input').blur(function() {
// console.log($('input').val().length);
if ($('input').val().length == 0) {
$('span').text('输入用户名不能为空');
$('input').css({ border: 'red 2px solid' });
} else {
$('span').text('');
$('input').css({ border: 'green 2px solid' });
}
});
</script>
</body>
</html>
1回答
同学你好,代码实现效果没有问题。
如果觉得不够优化,也可以将样式设置在style中,然后用addClass()和removeClass()添加和移除样式,如下:
可以测试下,祝学习愉快!
相似问题