学习随记
来源:互联网 发布:java程序员适合mac吗 编辑:程序博客网 时间:2024/05/18 02:46
学习笔记
我组在这周内尝试了使用php做网页登陆页面的简易代码,具体代码如下。
<html>
<head>
<metacharset="UTF-8">
<title>登录页面</title>
<style>
#registForm{
width: 500px;
height: 140px;
border: 1px solid #666;
margin: auto;
margin-top: 30px;
padding-left: 20px;
border-radius: 5px;
box-shadow: 10px 5px 5px#eee;
}
.lab1{
}
input[type=text]{
margin-left: 10px;
border: 1px dotted #a7c942;
border-radius: 5px;
box-shadow: 2px 3px 4px #666;
color: #666;
font-size: 14px;
font-weight: bold;
text-indent: 8px;
width:200px;
}
input[type=password]{
margin-left: 10px;
margin-left: 10px;
border: 1px dotted#a7c942;
border-radius: 5px;
box-shadow: 2px 3px 4px#666;
width:200px;
}
input[name=btn_submit]{
margin-left: 60px;
}
input[name=btn_reset]{
margin-left: 20px;
}
.btn{
background-color: green;
color: #fff;
border: 1px solid red;
border-radius: 5px;
}
.tip1, .tip2{
color: red;
}
</style>
</head>
<body>
<?php
// put your code here
?>
<formmethod="post" id="registForm"action="">
<p>
<labelfor="userName">用户名</label>
<inputtype="text"name="userName" id="userName">
<spanclass="tip1">*</span>
</p>
<p>
<labelfor="userPass">密 码</label>
<inputtype="password"name="userPass" id="userPass">
<spanclass="tip2">*</span>
</p>
<p>
<inputtype="submit"name="btn_submit" value="登录"class="btn">
<inputtype="reset"name="btn_reset" value="登出"class="btn">
</p>
</form>
</body>
<scriptsrc="jquery.js"></script>
<script>
$(function () {
$("#userName").blur(function() {
// alert("haha");
var len=$("#userName").val().length;
//alert(len);
if (len < 5) {
$(".tip1").html("请至少5位以上。");
$(".tip1").css("color","red");
} else
{
$(".tip1").html("√");
$(".tip1").css("color","green");
}
});
$("#userPass").blur(function() {
// alert("haha");
var len =$("#userPass").val().length;
//alert(len);
if (len < 5) {
$(".tip2").html("请至少3位以上。");
$(".tip2").css("color","red");
} else
{
$(".tip2").html("√");
$(".tip2").css("color","green");
}
});
});
</script>
</html>
蔡贵城,谢讯组,
017,11,24
- 学习随记
- 学习随记
- 学习随记
- 学习随记
- 学习随记
- 学习随记
- 学习随记
- Smarty 学习随记!
- magento学习随记
- hadoop学习随记 二
- 2011.10.20学习随记
- 11.07学习随记
- 11.08学习随记
- 11.10学习随记
- 01--JDK学习随记
- 随记-工作,学习,生活
- java4android 学习随记
- 设计模式 学习随记
- java方向
- 一些看起来很特殊的for循环代码,以及sizeof和strlen代码运行机制,还有#define
- AndroidStudio中修改项目名称和包名
- 链栈实现数制的转换
- mongodb复制集安装
- 学习随记
- Spring Data Jpa实现分页查询
- net::err_unknown_url_scheme 使用ckplayer 插件播放视频报错
- Apache2.4报错: Invalid command 'Order', perhaps misspelled or defined by a module not included in the
- BF和KMP算法
- C++ Templates中文版 p61页的一个问题
- mybatis简介
- mybatis-one-many
- Android 使用类加载器原理实现热修复