API tools faq
paste
Advertisement
beannshie

LocalStorage problem

beannshie
Sep 30th, 2017
214
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.06 KB | None | 0 0
raw download clone embed print report
  1. HTML :
  2.  
  3. <!DOCTYPE html>
  4. <html>
  5. <head>
  6. <title>Test 6</title>
  7. <link rel='stylesheet' href="Test 6.css"/>
  8. </head>
  9. <body>
  10. <div id="log">
  11. <div class="user-log" id="user1-log"><p></p></div>
  12. <div class="user-log" id="user2-log"><p></p></div>
  13. <div class="user-log" id="user3-log"><p></p></div>
  14. <div class="user-log" id="user4-log"><p></p></div>
  15. <div class="user-log" id="user5-log"><p></p></div>
  16. <div class="user-log" id="user6-log"><p></p></div>
  17. <div class="user-log" id="user7-log"><p></p></div>
  18. <div class="user-log" id="user8-log"><p></p></div>
  19. <div class="user-log" id="user9-log"><p></p></div>
  20. <div class="user-log" id="user10-log"><p></p></div>
  21. <div class="user-log" id="user11-log"><p></p></div>
  22. <div class="user-log" id="user12-log"><p></p></div>
  23. <div class="user-log" id="user13-log"><p></p></div>
  24. <div class="user-log" id="user14-log"><p></p></div>
  25. <div class="user-log" id="user15-log"><p></p></div>
  26. <div class="user-log" id="user16-log"><p></p></div>
  27. <div class="user-log" id="user17-log"><p></p></div>
  28. <div class="user-log" id="user18-log"><p></p></div>
  29. <div class="user-log" id="user19-log"><p></p></div>
  30. <div class="user-log" id="user20-log"><p></p></div>
  31. </div>
  32.  
  33. <div class="login-register">
  34. <!-- Login -->
  35. <div class="login">
  36. <label>Login</label>
  37. <input type="text" id="login-username" class="textbox" placeholder="Username"/>
  38. <input type="password" id="login-password" class="textbox" placeholder="Password"/>
  39. <button type="submit" onclick="login()">Login</button>
  40. </div>
  41.  
  42. <!-- Register -->
  43. <div class="register">
  44. <label>Register</label>
  45. <input type="text" id="register-username" class="textbox" placeholder="Username"/>
  46. <input type="password" id="register-password" class="textbox" placeholder="Password"/>
  47. <button type="submit" onclick="register()">Register</button>
  48. </div>
  49.  
  50. <!--Log Out-->
  51. <div class="logout">
  52. <button type="submit" onclick="logout()">Log Out</button>
  53. </div>
  54. </div>
  55.  
  56. <script src="Test 6.js"></script>
  57. </body>
  58. </html>
  59.  
  60.  
  61.  
  62. JAVASCRIPT :
  63.  
  64. if(localStorage.getItem("logged") !== undefined) {
  65. logged = localStorage.getItem("logged");
  66. }
  67. else {
  68. localStorage.setItem("logged", logged);
  69. }
  70.  
  71. function login() {
  72. if(logged == "yes") {alert("You are already logged in.");
  73. } else if (document.getElementById("login-username").value == username1 && document.getElementById("login-password").value == password1) {
  74. alert("Hi " + username1 + " you are now logged in.");
  75. logged = "yes";
  76. console.log(logged);
  77. localStorage.setItem("logged", "yes");
  78. console.log(localStorage.getItem("logged"));
  79. document.getElementById("user1-log").style.display = "block";
  80. } else if(document.getElementById("login-username").value == username2 && document.getElementById("login-password").value == password2) {
  81. alert("Hi " + username2 + " you are now logged in.");
  82. for (var key in usernameAlphaLog ) usernameAlphaLog [key] = 0;
  83. usernameAlphaLog['user2-log'] = 1;
  84. console.log(localStorage.getItem("user2-log"));
  85. document.getElementById("user2-log").style.display = "block";
  86. } else if(document.getElementById("login-username").value == username3 && document.getElementById("login-password").value == password3) {
  87. alert("Hi " + username3 + " you are now logged in.");
  88. localStorage.getItem("user3-log") = 1;
  89. } else if(document.getElementById("login-username").value == username4 && document.getElementById("login-password").value == password4) {
  90. alert("Hi " + username4 + " you are now logged in.");
  91. localStorage.getItem("user4-log") = 1;
  92. } else if(document.getElementById("login-username").value == username5 && document.getElementById("login-password").value == password5) {
  93. alert("Hi " + username5 + " you are now logged in.");
  94. localStorage.getItem("user5-log") = 1;
  95. } else if(document.getElementById("login-username").value == username6 && document.getElementById("login-password").value == password6) {
  96. alert("Hi " + username6 + " you are now logged in.");
  97. localStorage.getItem("user6-log") = 1;
  98. } else if(document.getElementById("login-username").value == username7 && document.getElementById("login-password").value == password7) {
  99. alert("Hi " + username7 + " you are now logged in.");
  100. localStorage.getItem("user7-log") = 1;
  101. } else if(document.getElementById("login-username").value == username8 && document.getElementById("login-password").value == password8) {
  102. alert("Hi " + username8 + " you are now logged in.");
  103. localStorage.getItem("user8-log") = 1;
  104. } else if(document.getElementById("login-username").value == username9 && document.getElementById("login-password").value == password9) {
  105. alert("Hi " + username9 + " you are now logged in.");
  106. localStorage.getItem("user9-log") = 1;
  107. } else if(document.getElementById("login-username").value == username10 && document.getElementById("login-password").value == password10) {
  108. alert("Hi " + username10 + " you are now logged in.");
  109. localStorage.getItem("user10-log") = 1;
  110. } else if(document.getElementById("login-username").value == username11 && document.getElementById("login-password").value == password11) {
  111. alert("Hi " + username11 + " you are now logged in.");
  112. localStorage.getItem("user11-log") = 1;
  113. } else if(document.getElementById("login-username").value == username12 && document.getElementById("login-password").value == password12) {
  114. alert("Hi " + username12 + " you are now logged in.");
  115. localStorage.getItem("user12-log") = 1;
  116. } else if(document.getElementById("login-username").value == username13 && document.getElementById("login-password").value == password13) {
  117. alert("Hi " + username13 + " you are now logged in.");
  118. localStorage.getItem("user13-log") = 1;
  119. } else if(document.getElementById("login-username").value == username14 && document.getElementById("login-password").value == password14) {
  120. alert("Hi " + username14 + " you are now logged in.");
  121. localStorage.getItem("user14-log") = 1;
  122. } else if(document.getElementById("login-username").value == username15 && document.getElementById("login-password").value == password15) {
  123. alert("Hi " + username15 + " you are now logged in.");
  124. localStorage.getItem("user15-log") = 1;
  125. } else if(document.getElementById("login-username").value == username16 && document.getElementById("login-password").value == password16) {
  126. alert("Hi " + username16 + " you are now logged in.");
  127. localStorage.getItem("user16-log") = 1;
  128. } else if(document.getElementById("login-username").value == username17 && document.getElementById("login-password").value == password17) {
  129. alert("Hi " + username17 + " you are now logged in.");
  130. localStorage.getItem("user17-log") = 1;
  131. } else if(document.getElementById("login-username").value == username18 && document.getElementById("login-password").value == password18) {
  132. alert("Hi " + username18 + " you are now logged in.");
  133. localStorage.getItem("user18-log") = 1;
  134. } else if(document.getElementById("login-username").value == username19 && document.getElementById("login-password").value == password19) {
  135. alert("Hi " + username19 + " you are now logged in.");
  136. localStorage.getItem("user19-log") = 1;
  137. } else if(document.getElementById("login-username").value == username20 && document.getElementById("login-password").value == password20) {
  138. alert("Hi " + username20 + " you are now logged in.");
  139. localStorage.getItem("user20-log") = 1;
  140. } else {alert("Wrong username or password");}
  141. }
  142.  
  143. function register() {
  144. if(usernameAlpha.indexOf(document.getElementById("register-username").value) > -1) {alert("Username taken")
  145. } else if (username1 == null && password1 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  146. localStorage.removeItem("username1");
  147. localStorage.setItem("username1", document.getElementById("register-username").value);
  148. localStorage.removeItem("password1");
  149. localStorage.setItem("password1", document.getElementById("register-password").value);
  150. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  151. location.reload();
  152. } else if (username2 == null && password2 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  153. localStorage.removeItem("username2");
  154. localStorage.setItem("username2", document.getElementById("register-username").value);
  155. localStorage.removeItem("password2");
  156. localStorage.setItem("password2", document.getElementById("register-password").value);
  157. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  158. location.reload();
  159. } else if (username3 == null && password3 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  160. localStorage.removeItem("username3");
  161. localStorage.setItem("username3", document.getElementById("register-username").value);
  162. localStorage.removeItem("password3");
  163. localStorage.setItem("password3", document.getElementById("register-password").value);
  164. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  165. location.reload();
  166. }else if (username4 == null && password4 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  167. localStorage.removeItem("username4");
  168. localStorage.setItem("username4", document.getElementById("register-username").value);
  169. localStorage.removeItem("password4");
  170. localStorage.setItem("password4", document.getElementById("register-password").value);
  171. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  172. location.reload();
  173. } else if (username5 == null && password5 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  174. localStorage.removeItem("username5");
  175. localStorage.setItem("username5", document.getElementById("register-username").value);
  176. localStorage.removeItem("password5");
  177. localStorage.setItem("password5", document.getElementById("register-password").value);
  178. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  179. location.reload();
  180. } else if (username6 == null && password6 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  181. localStorage.removeItem("username6");
  182. localStorage.setItem("username6", document.getElementById("register-username").value);
  183. localStorage.removeItem("password6");
  184. localStorage.setItem("password6", document.getElementById("register-password").value);
  185. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  186. location.reload();
  187. } else if (username7 == null && password7 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  188. localStorage.removeItem("username7");
  189. localStorage.setItem("username7", document.getElementById("register-username").value);
  190. localStorage.removeItem("password7");
  191. localStorage.setItem("password7", document.getElementById("register-password").value);
  192. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  193. location.reload();
  194. } else if (username8 == null && password8 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  195. localStorage.removeItem("username8");
  196. localStorage.setItem("username8", document.getElementById("register-username").value);
  197. localStorage.removeItem("password8");
  198. localStorage.setItem("password8", document.getElementById("register-password").value);
  199. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  200. location.reload();
  201. } else if (username9 == null && password9 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  202. localStorage.removeItem("username9");
  203. localStorage.setItem("username9", document.getElementById("register-username").value);
  204. localStorage.removeItem("password9");
  205. localStorage.setItem("password9", document.getElementById("register-password").value);
  206. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  207. location.reload();
  208. }else if (username10 == null && password10 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  209. localStorage.removeItem("username10");
  210. localStorage.setItem("username10", document.getElementById("register-username").value);
  211. localStorage.removeItem("password10");
  212. localStorage.setItem("password10", document.getElementById("register-password").value);
  213. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  214. location.reload();
  215. } else if (username11 == null && password11 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  216. localStorage.removeItem("username11");
  217. localStorage.setItem("username11", document.getElementById("register-username").value);
  218. localStorage.removeItem("password11");
  219. localStorage.setItem("password11", document.getElementById("register-password").value);
  220. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  221. location.reload();
  222. } else if (username12 == null && password12 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  223. localStorage.removeItem("username12");
  224. localStorage.setItem("username12", document.getElementById("register-username").value);
  225. localStorage.removeItem("password12");
  226. localStorage.setItem("password12", document.getElementById("register-password").value);
  227. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  228. location.reload();
  229. } else if (username13 == null && password13 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  230. localStorage.removeItem("username13");
  231. localStorage.setItem("username13", document.getElementById("register-username").value);
  232. localStorage.removeItem("password13");
  233. localStorage.setItem("password13", document.getElementById("register-password").value);
  234. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  235. location.reload();
  236. }else if (username14 == null && password14 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  237. localStorage.removeItem("username14");
  238. localStorage.setItem("username14", document.getElementById("register-username").value);
  239. localStorage.removeItem("password14");
  240. localStorage.setItem("password14", document.getElementById("register-password").value);
  241. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  242. location.reload();
  243. } else if (username15 == null && password15 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  244. localStorage.removeItem("username15");
  245. localStorage.setItem("username15", document.getElementById("register-username").value);
  246. localStorage.removeItem("password15");
  247. localStorage.setItem("password15", document.getElementById("register-password").value);
  248. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  249. location.reload();
  250. } else if (username16 == null && password16 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  251. localStorage.removeItem("username16");
  252. localStorage.setItem("username16", document.getElementById("register-username").value);
  253. localStorage.removeItem("password16");
  254. localStorage.setItem("password16", document.getElementById("register-password").value);
  255. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  256. location.reload();
  257. } else if (username17 == null && password17 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  258. localStorage.removeItem("username17");
  259. localStorage.setItem("username17", document.getElementById("register-username").value);
  260. localStorage.removeItem("password17");
  261. localStorage.setItem("password17", document.getElementById("register-password").value);
  262. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  263. location.reload();
  264. } else if (username18 == null && password18 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  265. localStorage.removeItem("username18");
  266. localStorage.setItem("username18", document.getElementById("register-username").value);
  267. localStorage.removeItem("password18");
  268. localStorage.setItem("password18", document.getElementById("register-password").value);
  269. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  270. location.reload();
  271. } else if (username19 == null && password19 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  272. localStorage.removeItem("username19");
  273. localStorage.setItem("username19", document.getElementById("register-username").value);
  274. localStorage.removeItem("password19");
  275. localStorage.setItem("password19", document.getElementById("register-password").value);
  276. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  277. location.reload();
  278. }else if (username20 == null && password20 == null && document.getElementById("register-username").value != "" && document.getElementById("register-password").value != "") {
  279. localStorage.removeItem("username20");
  280. localStorage.setItem("username20", document.getElementById("register-username").value);
  281. localStorage.removeItem("password20");
  282. localStorage.setItem("password20", document.getElementById("register-password").value);
  283. alert("Hi, " + document.getElementById("register-username").value + " is now registered.");
  284. location.reload();
  285. }
  286. }
  287.  
  288. function logout() {
  289. document.getElementById("user1-log").style.display = "none";
  290. document.getElementById("user2-log").style.display = "none";
  291. document.getElementById("user3-log").style.display = "none";
  292. document.getElementById("user4-log").style.display = "none";
  293. document.getElementById("user5-log").style.display = "none";
  294. document.getElementById("user6-log").style.display = "none";
  295. document.getElementById("user7-log").style.display = "none";
  296. document.getElementById("user8-log").style.display = "none";
  297. document.getElementById("user9-log").style.display = "none";
  298. document.getElementById("user10-log").style.display = "none";
  299. document.getElementById("user11-log").style.display = "none";
  300. document.getElementById("user12-log").style.display = "none";
  301. document.getElementById("user13-log").style.display = "none";
  302. document.getElementById("user14-log").style.display = "none";
  303. document.getElementById("user15-log").style.display = "none";
  304. document.getElementById("user16-log").style.display = "none";
  305. document.getElementById("user17-log").style.display = "none";
  306. document.getElementById("user18-log").style.display = "none";
  307. document.getElementById("user19-log").style.display = "none";
  308. document.getElementById("user20-log").style.display = "none";
  309. logged = "no";
  310. localStorage.setItem("logged", "no");
  311. alert("Successfully logged out.");
  312. }
  313.  
  314. if(logged == "yes") {
  315. } else {
  316. localStorage.setItem("logged", "no");
  317. var logged = localStorage.getItem("logged");
  318. }
  319.  
  320. window.onload = function() {
  321.  
  322. document.getElementById("user1-log").innerHTML = username1;
  323. document.getElementById("user2-log").innerHTML = username2;
  324. document.getElementById("user3-log").innerHTML = username3;
  325. document.getElementById("user4-log").innerHTML = username4;
  326. document.getElementById("user5-log").innerHTML = username5;
  327. document.getElementById("user6-log").innerHTML = username6;
  328. document.getElementById("user7-log").innerHTML = username7;
  329. document.getElementById("user8-log").innerHTML = username8;
  330. document.getElementById("user9-log").innerHTML = username9;
  331. document.getElementById("user10-log").innerHTML = username10;
  332. document.getElementById("user11-log").innerHTML = username11;
  333. document.getElementById("user12-log").innerHTML = username12;
  334. document.getElementById("user13-log").innerHTML = username13;
  335. document.getElementById("user14-log").innerHTML = username14;
  336. document.getElementById("user15-log").innerHTML = username15;
  337. document.getElementById("user16-log").innerHTML = username16;
  338. document.getElementById("user17-log").innerHTML = username17;
  339. document.getElementById("user18-log").innerHTML = username18;
  340. document.getElementById("user19-log").innerHTML = username19;
  341. document.getElementById("user20-log").innerHTML = username20;
  342.  
  343. /*
  344. var i=1;
  345. while(i<=20) {
  346. document.write("localStorage.getItem(user"+i+"-log), ")
  347. i++;
  348. }
  349. */
  350.  
  351. localStorage.setItem("usernameAlpha", usernameAlpha);
  352.  
  353. console.log(username1);
  354. console.log(password1);
  355. console.log(usernameAlpha);
  356. console.log(username2);
  357. console.log(username3);
  358. console.log(password2);
  359. console.log(password3);
  360. console.log(usernameAlpha);
  361. console.log(logged);
  362. console.log(localStorage.getItem("logged"));
  363.  
  364. }
  365.  
  366. //Database
  367.  
  368.  
  369. //username
  370.  
  371. var username1 = localStorage.getItem("username1");
  372. var username2 = localStorage.getItem("username2");
  373. var username3 = localStorage.getItem("username3");
  374. var username4 = localStorage.getItem("username4");
  375. var username5 = localStorage.getItem("username5");
  376. var username6 = localStorage.getItem("username6");
  377. var username7 = localStorage.getItem("username7");
  378. var username8 = localStorage.getItem("username8");
  379. var username9 = localStorage.getItem("username9");
  380. var username10 = localStorage.getItem("username10");
  381. var username11 = localStorage.getItem("username11");
  382. var username12 = localStorage.getItem("username12");
  383. var username13 = localStorage.getItem("username13");
  384. var username14 = localStorage.getItem("username14");
  385. var username15 = localStorage.getItem("username15");
  386. var username16 = localStorage.getItem("username16");
  387. var username17 = localStorage.getItem("username17");
  388. var username18 = localStorage.getItem("username18");
  389. var username19 = localStorage.getItem("username19");
  390. var username20 = localStorage.getItem("username20");
  391.  
  392. var usernameAlpha = [username1, username2, username3, username4, username5, username6, username7, username8, username9, username10, username11, username12, username13, username14, username15, username16, username17, username18, username19, username20];
  393. var usernameAlphaLog = [localStorage.getItem("user1-log"), localStorage.getItem("user2-log"), localStorage.getItem("user3-log"), localStorage.getItem("user4-log"), localStorage.getItem("user5-log"), localStorage.getItem("user6-log"), localStorage.getItem("user7-log"), localStorage.getItem("user8-log"), localStorage.getItem("user9-log"), localStorage.getItem("user10-log"), localStorage.getItem("user11-log"), localStorage.getItem("user12-log"), localStorage.getItem("user13-log"), localStorage.getItem("user14-log"), localStorage.getItem("user15-log"), localStorage.getItem("user16-log"), localStorage.getItem("user17-log"), localStorage.getItem("user18-log"), localStorage.getItem("user19-log"), localStorage.getItem("user20-log")];
  394.  
  395. //password
  396.  
  397. var password1 = localStorage.getItem("password1");
  398. var password2 = localStorage.getItem("password2");
  399. var password3 = localStorage.getItem("password3");
  400. var password4 = localStorage.getItem("password4");
  401. var password5 = localStorage.getItem("password5");
  402. var password6 = localStorage.getItem("password6");
  403. var password7 = localStorage.getItem("password7");
  404. var password8 = localStorage.getItem("password8");
  405. var password9 = localStorage.getItem("password9");
  406. var password10 = localStorage.getItem("password10");
  407. var password11 = localStorage.getItem("password11");
  408. var password12 = localStorage.getItem("password12");
  409. var password13 = localStorage.getItem("password13");
  410. var password14 = localStorage.getItem("password14");
  411. var password15 = localStorage.getItem("password15");
  412. var password16 = localStorage.getItem("password16");
  413. var password17 = localStorage.getItem("password17");
  414. var password18 = localStorage.getItem("password18");
  415. var password19 = localStorage.getItem("password19");
  416. var password20 = localStorage.getItem("password20");
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!