當前位置：首頁 » 編程語言 » html5注冊

html5注冊

發布時間: 2021-03-27 15:31:22

① html5注冊功能怎麼將賬號密碼存儲在本地

源碼如下

<script>
//先查看是否有本地數據（記住密碼）
/* function myfunction(){
var email = localStorage.getItem("email");
var password = localStorage.getItem("password");
if(email!=null&&password!=null){
alert("郵箱："+email+"密碼："+password);
$.ajax({
url : '../servlet/LoginServlet?choose=login',
data : {
email : email,
password : password
},
dataType : 'json',
success : function(data) {
if (data.msg == "") {
alert("用戶名或密碼錯誤");
} else {
//登錄成功後保存session，如果選擇了記住密碼，再保

存到本地
//window.location.href ='../index/index.jsp';
}
},
error : function() {
alert("系統錯誤");
}
});
}else{
//alert("沒有信息");

}
}
function saveStorage(){
var email = document.getElementById("email").value;
localStorage.setItem("email",email);
var password = document.getElementById("password").value;
localStorage.setItem("password",password);

}
function login(){
$.ajax({
url : '../servlet/LoginServlet?choose=login',
data : {
email : $('#loginform input[name=email]').val(),
password : $('#loginform input[name=password]').val()
},
dataType : 'json',
success : function(data) {
if (data.msg == "") {
alert("用戶名或密碼錯誤");
} else {
//登錄成功後保存session，如果選擇了記住密碼，再保存到

本地
window.location.href ='../index/index.jsp';
}
},
error : function() {
alert("系統錯誤");
}
});
}
function reg(){
$.ajax({
url : 'servlet/LoginServlet?choose=reg',
data : {
username : $('#regform input[name=username]').val(),
password : $('#regform input[name=password]').val(),
email : $('#regform input[name=email]').val(),
},
dataType : 'json',
success : function(data) {
if(data.msg == false){
alert("注冊失敗");
}else{
alert("注冊成功請返回登錄");
}
},
error : function() {
alert("系統錯誤");
}
});
} */
$(document).ready(function(){
//讀取 localStage 本地存儲，填充用戶名密碼,如果自動登錄有值直接跳轉

；
//相反，跳轉到本頁面,等待登陸處理
var storage = window.localStorage;
var getEmail = storage["email"];
var getPwd = storage["password"];
var getisstroepwd = storage["isstorePwd"];
var getisautologin = storage["isautologin"];
if("yes" == getisstroepwd)
{
if("yes" == getisautologin)
{
if(( ("" != getEmail) ||(null != getEmail)) && (("" !=

getPwd) ||(null != getPwd)))

② html的登錄注冊界面和後台資料庫代碼。要html 5的，要漂亮。

從資料庫讀出來，php會認為這是個字元串，而不是php代碼，所以字元串的形式輸出了，這是一個tp模板文件，你可以把數據讀出來之後寫成一個模板文件，然後由tp去執行

③ 這個首頁的html5網站設計代碼（尤其是頭部那登錄注冊代碼怎麼寫）

首先先說一下HTML5的代碼只是在原有的XHTML基礎上增加了一些新的標簽（還有一些新的特性，例如資料庫和緩存等特性）

以下為此頁面的結構代碼：

<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<metaname="revised"content=""/>
<metaname="keywords"content=""/>
<metaname="description"content=""/>
<metaname="author"content=""/>
<metaname="robots"content="all"/>
<title>頁面標題</title>
</head>

<body>
<header>
<div></div><!--登陸注冊區域-->
</header><!--頭部[html5新標簽]-->
<nav></nav><!--導航[html5新標簽]-->
<div></div><!--banner-->
<div></div><!--左上-->
<div></div><!--右上-->
<div></div><!--左下-->
<div></div><!--右下-->
<footer></footer><!--底部[html5新標簽]-->
</body>
</html>

註：以上為頁面的大的框架，相對用HTML5新的標簽更合理的，全用上了新的帶有語義標簽。

另外多說一下，[注冊登陸]這塊在html5的新標簽裡面沒有很合適的語義化的標簽，所以依然採用原有的div標簽為最合理。html5隻是在原有的技術的基礎上更細化了，咱在製作代碼的過程中沒必要必須用HTML5的代碼，主要看是否合理，合理的為較合適的。

多說的：不管用XHTML還是HTML5寫代碼，結構（HTML5）與樣式（CSS）盡量要分離！

希望能幫到你！

④ HTML5寫注冊頁面

http://blog.csdn.net/miachen520/article/details/51811253

⑤ 怎麼用html5編寫用戶注冊驗證程序

1
第一步:用戶注冊界面製作在製作用戶界面的時候我們得考慮需要哪些元素,一般情況下我們可能只要3種元素:賬號(user)、密碼(password)還有用來取回密碼的郵箱(email)或其它認證。
2
第二步:添加欄位提示使用html5提供的placeholder屬性來為表單添加提示信息.如:
給用戶名添加提示信息:<input type="text" name="user" placeholder="用戶名長度為3~12" />
給密碼添加提示信息:<input type="password" name="password" placeholder="密碼必須是數組與字母組合"
3
第三步:為必填欄位添加required屬性如:給用戶名添加必填:<input type="text" name="user" placeholder="用戶名長度為3~12" required/>
添加required屬性的欄位如果在提交過程中沒有填寫就會彈出提示.
4
第四步:給欄位添加驗證規制
可以用html5的pattern屬性來給要驗證的欄位添加正則表達式來驗欄位
1:用戶名驗證規則 : 用戶名長度為3~12並且由字母組成
pattern="[A-z]{3,12}"
2:密碼驗證規則 : 密碼必須是數組與字母組合
pattern="[A-Za-z].*[0-9]|[0-9].*[A-Za-z]"

⑥ html5 登陸注冊頁面用到的技術

HTML5+CSS3+Jquery寫一個漂亮的登陸框；
ajax實現無刷新驗證；
響應式設計；

⑦ html5寫這個注冊頁面怎麼寫啊

<!DOCTYPEhtml>
<html>

<head>
<metacharset="utf-8"/>
<metaname="viewport"content="width=device-width,initial-scale=1">
<title>Bootstrap4</title>
<linkrel="stylesheet"href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+/dAiS6JXm"crossorigin="anonymous">
<linkrel="stylesheet"href="bootstrap-colorpicker/css/bootstrap-colorpicker.css">
<linkrel="stylesheet"href="bootstrap-datepicker/css/bootstrap-datetimepicker.min.css">
<styletype="text/css">
.main-box{
width:640px;
margin:40pxauto;
}
</style>
</head>

<body>
<divclass="main-box">
<form>
<divclass="form-grouprow">
<labelfor="name"class="col-sm-2col-form-label">用戶名</label>
<divclass="col-sm-10">
<inputtype="text"class="form-control"id="name"placeholder="請輸入用戶名">
</div>
</div>

<divclass="form-grouprow">
<labelfor="pwd"class="col-sm-2col-form-label">密碼</label>
<divclass="col-sm-10">
<inputtype="password"class="form-control"id="pwd"placeholder="請輸入密碼">
</div>
</div>

<divclass="form-grouprow">
<labelfor="pwd2"class="col-sm-2col-form-label">確認密碼</label>
<divclass="col-sm-10">
<inputtype="password"class="form-control"id="pwd2"placeholder="請輸入確認密碼">
</div>
</div>

<divclass="form-grouprow">
<labelfor="area"class="col-sm-2col-form-label">區域</label>
<divclass="col-sm-10">
<selectclass="form-controlform-control-lg"id="area">
<option>四川省</option>
</select>
</div>
</div>

<fieldsetclass="form-group">
<divclass="row">
<legendclass="col-form-labelcol-sm-2pt-0">性別</legend>
<divclass="col-sm-10">
<divclass="form-checkform-check-inline">
<inputclass="form-check-input"type="radio"name="inlineRadioOptions"id="inlineRadio1"value="option1"
checked="true">
<labelclass="form-check-label"for="inlineRadio1">男</label>
</div>
<divclass="form-checkform-check-inline">
<inputclass="form-check-input"type="radio"name="inlineRadioOptions"id="inlineRadio2"value="option2">
<labelclass="form-check-label"for="inlineRadio2">女</label>
</div>
</div>
</div>
</fieldset>

<divclass="form-grouprow">
<labelfor="age"class="col-sm-2col-form-label">年齡</label>
<divclass="col-sm-10">
<inputtype="email"class="form-control"id="age"placeholder="請輸入年齡">
</div>
</div>

<divclass="form-grouprow">
<labelfor="age"class="col-sm-2col-form-label">生日</label>
<divclass="col-sm-10">
<inputsize="16"type="text"value="2012-06-15"readonlyclass="form-controlform_datetime">
</div>
</div>

<divclass="form-grouprow">
<labelfor="phone"class="col-sm-2col-form-label">手機號</label>
<divclass="col-sm-10">
<inputtype="text"class="form-control"id="phone"placeholder="請輸入手機號">
</div>
</div>

<divclass="form-grouprow">
<labelfor="phone"class="col-sm-2col-form-label">頭像</label>
<divclass="col-sm-10">
<inputtype="file"class="form-control-file"id="exampleFormControlFile1">
</div>
</div>

<divclass="form-grouprow">
<labelfor="site"class="col-sm-2col-form-label">主頁</label>
<divclass="col-sm-10">
<inputtype="text"class="form-control"id="site"placeholder="請輸入主頁">
</div>
</div>

<divclass="form-grouprow">
<labelfor="email"class="col-sm-2col-form-label">Email</label>
<divclass="col-sm-10">
<inputtype="email"class="form-control"id="email"placeholder="請輸入Email">
</div>
</div>

<divclass="form-grouprow">
<labelclass="col-sm-2col-form-label">喜歡的顏色</label>
<divclass="col-sm-10">
<inputid="likeColor"type="text"class="form-control"value="#5367ce"/>
</div>
</div>

<divclass="form-grouprow">
<divclass="col-sm-2"></div>
<divclass="col-sm-10">
<divclass="form-check">
<inputclass="form-check-input"type="checkbox"value=""id="defaultCheck1">
<labelclass="form-check-label"for="defaultCheck1">
同意服務條款
</label>
</div>
</div>
</div>
<divclass="form-grouprow">
<divclass="col-sm-10">
<buttontype="submit"class="btnbtn-primary">注冊</button>
<buttontype="submit"class="btn">取消</button>
</div>
</div>
</form>
</div>

<scriptsrc="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X++8abtTE1Pi6jizo"crossorigin="anonymous">
</script>
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-"crossorigin="anonymous">
</script>
<scriptsrc="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-/nJGzIxFDsf4x0xIM+B07jRM"crossorigin="anonymous">
</script>
<scriptsrc="bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>
<scriptsrc="bootstrap-datepicker/js/bootstrap-datetimepicker.min.js"></script>
<script>
$('#likeColor').colorpicker();
$(".form_datetime").datetimepicker({
format:'yyyy-mm-dd',
weekStart:1,
todayBtn:1,//今日日期按鈕
autoclose:1,//自動關閉
todayHighlight:1,//高亮今日日期
startView:2,//從日期視圖開始
minView:2,
forceParse:0
});
</script>
</body>

</html>

案例下載

⑧ HTML5如何實現注冊用戶時使用多種方式

你可以做成選項卡的樣子。點擊不同的選項卡切換不同頁面內容

⑨ 如何在HTML5設計中，增加登陸界面，採用手機注冊，驗證碼，信息注冊框等

要用手機驗證碼功能，你需要向通訊服務商（移動、聯通、電信）申請一個號碼，用於給客戶發送驗證簡訊

⑩ 求如何使用html5的web sql database實現注冊和登錄

你是指html5的本地本地存儲？Web SQL Database規范已經被廢棄了，現在要用就用Web Storage和IndexedDB吧。

閱讀全文

html5注冊

與html5注冊相關的閱讀推薦