<!DOCTYPE?html>
<html>
<head>
<meta?charset="utf-8">
<title>LOGIN</title>
<link?rel="stylesheet"?type="text/css"?href="css/main.css">
<link?rel="stylesheet"?type="text/css"?href="css/login.css">
</head>
<body>
<div?class="content">
<form?action=""?method="get"?name="form"?>
<input?type="text"?placeholder="Username"?value=""?id="username">
<input?type="password"?placeholder="password"?value=""?id="password">
<ul?class="wrap">
<li><a?href="#">Remember?me</a></li>
<li><a?href="#">Forgot?your?password?</a></li>
</ul>
<div?id="login">
<a?href="#"?onclick="check()">LOGIN</a>
</div>
</form>
</div>
<script>
function?check(){
var?txtValue?=?document.querySelector('input').value;
var?txtName?=?document.querySelector('input').name;
//?JSON
}
}
</script>
</body>
</html>想要檢測用戶名和密碼的值是否為空, 并且在 console 中返回 JSON{? ? "username" : "",? ? "password" : ""??}并且相同的代碼不做修改, 也可以應用在這個頁面<!DOCTYPE?html>
<html>
<head>
<meta?charset="utf-8">
<title>CREATE</title>
<link?rel="stylesheet"?type="text/css"?href="css/main.css">
<link?rel="stylesheet"?type="text/css"?href="css/create.css">
</head>
<body>
<div?class="content">
<h2>Register?new?account</h2>
<form?action=""?method="post">
<input?type="text"?placeholder="First?Name"??name="firstname"id="firstname">
<input?type="text"?placeholder="Last?Name"???name="lastname"id="lastname">
<input?type="text"??placeholder="Nick?Name"?name="nickname">
<input?type="text"??placeholder="City"?name="city">
<input?type="tel"??placeholder="Phone?Number"?name="phone">
<input?type="email"??placeholder="Email"?name="email">
<input?type="submit"?value="Create?Account"?id="submit-create">
</form>
</div>
<script>
</script>
</body>
</html>求大神
JS 輸出 JSON
Kitayama
2016-04-27 08:12:47