麻烦老师解决一个问题
来源：4-3 编程练习
alluremyy
2019-04-04 16:23:16
<!DOCTYPE html>
<html>
<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>
$(document).ready(function(){
$("input").focus(function(){
$("span").text("请输入内容");
});
$("input").blur(function(){
if ($(this).val()=="") {
$(this).css({"border":"2px solid red"});
$("span").text("内容不能为空");
}else{
$(this).css({"border":"2px solid green"});
$("span").text("");
}
})
})
</script>
</body>
</html>
当未输入内容时，失去焦点输入框变红，怎么设置重新获取焦点输入框取消掉红色样式还原最初样式？
另外我感觉这种简单操作代码不应该很长，麻烦老师给出简化建议
2回答
-
好帮手慕糖
2019-04-04
同学你好，按照你修改的代码，效果是没有问题的哦，另，如下图，这个return是可以去掉的哦。
祝学习愉快！
0 -
alluremyy
提问者
2019-04-04
我改了一下，效果实现了，还是麻烦老师指出改进的地方
<script>
$(document).ready(function(){
$("input").focus(function(){
$(this).css({"border":"1px solid #87cefa"})
$("span").text("请输入内容");
});
$("input").blur(function(){
if ($(this).val()=="") {
$(this).css({"border":"2px solid red"});
$("span").text("内容不能为空");
return;
}else{
$(this).css({"border":"2px solid green"});
$("span").text("");
}
})
})
</script>
0
相似问题