http://codepen.io/anon/pen/GWKoZW (code在此)
測試發現 input裡面加了required="",想讓某些欄位設定成必填,想說按下送出前,會提醒必填欄位空白的地方未填寫,但發現表單什麼都沒填,按下按鈕就會送出了.....excel也確定會自己生出一筆未定義的資料...
excel連結 https://docs.google.com/spreadsheets/d/12Hx73MOTDhCheDhG8xsU0kU6N03wLCWg4eym-1GnokU/edit?usp=sharing
爬文說location.assign可以指定....在按完按鈕後到連接到指定page, 但發現好像不是每個網站都可以顯示出來(至少在codepen中,連w3c可以,連yahoo、google會空白)
→如果想要按下 "加入會員" 先判定表格是否有填寫好,ture 直接連到google首頁,fause 則是停留在原本表單畫面,該怎麼寫呢?
input type"reset",雖然有放入,但好像沒什麼反應,,欄位上有填寫資料,按下重新填寫按鈕,資料還在欄位上。是漏掉什麼了嗎? w3c範例直接這樣設定就ok,但我的卻沒反應 T^T
2017/02/22 16:45 update
謝謝魷魚,required=""與reset的部分已經解決了!!! 因為自己的粗心沒注意到小細節。
就剩下js跳轉往頁的部分了QQ
2017/02/22 17:02 update
有的!!! 謝謝海綿寶寶~ required 跟reset KO它們了!!! (Y)
作者:pratnket
版本:2017_Var3
JS頁
---###變數說明###---
Home 預設頁面
Cookie 預設cookie名稱
---###方法說明###---
修改設定值
Redirect.config({
Home:"index.php",
Cookie:"Href_Url"
});
儲存 Cookie
Redirect.cookie_Save("index.php");
Redirect.cookie_Save("pratnket","index.php");
讀取 Cookie
Redirect.cookie_Load("URL");
alert訊息
Redirect.msg("跳轉插件");
讀取 Cookie
Redirect.load("URL");
跳轉網址
Redirect.JumpURL();
Redirect.config("").JumpURL();
Redirect.config({}).msg("").JumpURL();
---###使用範例###---
修改預設變數範例
Redirect.config({
Home:"index.php",
Cookie:"Href_Url"
});
Redirect.save( "http://ithelp.ithome.com.tw/" );
Redirect.msg( "預設變數URL: " + Redirect.load("URL") );
Redirect.msg( "預設變數Href_Url: " + Redirect.load("Href_Url") );
Redirect.msg( "跳轉前可輸入訊息").JumpURL(Redirect.load("Href_Url") );
複製程式碼
<script>
(function () {
//預設值
var options = {
Home: 'index.php',
Cookie: 'URL',
}
//API
var api = {
//修改預設值
config: function (opts) {
if(!opts) return options;
for(var key in opts) {
options[key] = opts[key];
}
return this;
},
//保存網址(COOKIE變數)
msg: function (message) {
if (typeof message === 'string') {
alert(message);
}
return this;
},
//保存網址(COOKIE變數)
cookie_Save: function () {
if (typeof arguments[0] === 'string') {
if(arguments.length == 1)
document.cookie = options.Cookie + "=" + arguments[0];
if(arguments.length == 2)
document.cookie = arguments[0] + "=" + arguments[1];
}
return this;
},
//讀取網址(COOKIE變數)
cookie_Load: function (name) {
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
return unescape(arr[2]);
},
//跳轉頁面
//只可輸入字串
JumpURL: function JumpURL(TargetPage) {
//無輸入字串
if (TargetPage == null) {
//跳轉預設值頁面
window.location = options.Home;
}
//輸入的變數 型態與數值 必需是 字串
if (typeof TargetPage === 'string') {
//返回上頁
if (TargetPage == "back" || TargetPage == "return"){
//歷史紀錄 大於 1
if (history.length > 1){
history.back(-1)
}else{
//返回預設值頁面
window.location = options.Home ;
}
}
//關閉【視窗】
if (TargetPage == "close"){
window.close();
}
//重新整理頁面
if (TargetPage == "reflash" || TargetPage == "reload") {
location.reload();
}
//跳轉指定頁面
window.location = TargetPage;
}
return this;
}
}
this.Redirect = api;
})();
</script>
使用頁
<script src="Redirect.js"></script>
<script>
Redirect.msg( "跳轉前可輸入訊息").JumpURL(Redirect.load("Href_Url") );
Redirect.msg( "跳轉前可輸入訊息").JumpURL("https://www.google.com.tw/");
</script>
使用頁
數值1: <input id="fname" type="text" value="Mickey" required=""/>
數值2: <input id="lname" type="text" value="Mouse" required="" />
數值3: <input id="lname2" type="text" value="Mouse" required="" />
數值4: <input id="lname3" type="text" value="Mouse" required="" />
<input id="sub" type="button" value="Submit" onclick="Verificat.Form()" />
JS頁
表單驗證
(function () {
//預設值
var options = {
Form: 'Form',
Placeholder: '請填寫入數值',
Style: 'background-color:powderblue',
Msg: '你尚有內容未填寫',
}
//API
var api = {
//修改預設值
config: function (opts) {
if(!opts) return options;
for(var key in opts) {
options[key] = opts[key];
}
return this;
},
//只可輸入字串
Form: function Form() {
var x = document.getElementById("Form");
for (var i=0 ; i < x.length ; i++){
if(x.elements[i].required){
if (x.elements[i].value==null || x.elements[i].value=="")
{
x.elements[i].style = options.Style;
x.elements[i].placeholder = options.Placeholder;
content = true;
}
}
}
if(content) alert(options.Msg);
return this;
}
}
this.Verificat = api;
})();