2015-01-13 34 views
0

嘿,夥計們是新來javascript.I有html..The代碼,我已經做了請保存JS內

<form action="" id="avi"> 
<input type="radio" name="sex" value="male">Male<br> 
<input type="radio" name="sex" value="female">Female 
</form> 
<br></br> 

<button type="button" id="bae">save me </button> 

<script> 

var c = document.getElementById('bae'); 
c.onclick = function() { 
var m = document.getElementById('avi'); 
return m.checked; 
} 
</script> 

什麼,我需要做的

的單選按鈕檢查選項選中的選項我需要做的事情是,當我點擊save me button我只需要保存點擊收音機的位置...假設如果我點擊男性選項並點擊保存,我需要在刷新後看到那些點擊收音機選項..

這可以做到不存儲在數據庫??我認爲這可以用JS大多數評論指出您使用localStorage的走向做..

Thanksfor幫助

+1

你可以將其保存在cookie中。或本地存儲。 – j08691

+0

@ j08691你可以給我的代碼或任何鏈接..這將是有益的..Thanx' – jslover

+0

你能解釋更多關於你的意思嗎?取決於持久性如何需要保存答案將不同 – atmd

回答

0

所以,在這裏我們去:

存儲的值

localStorage.setItem(key, value); 
// i.e. localStorage.setItem("name", "bob"); 

要獲得值回覆你會做

localStorage.getItem(key) 
// i.e. localStorage.getItem('name'); 

這樣:

<input id="male" type="radio" name="sex" value="male">Male 
<input id="female" type="radio" name="sex" value="female">Female 



if(document.getElementById('male').checked){ 
    localStorage.setItem('sex', 'male'); 
} 
if(document.getElementById('female').checked){ 
    localStorage.setItem('sex', 'female'); 
} 


// getting the value 
if(localStorage.getItem('sex')){ 
    // if localStorage.getItem('sex') == male, set the male checkbox 
    // female if not 
} 
+0

你能用我的概念編輯答案嗎?..我已經完成if(value is checked){localstorage.getItem(value); }但我不能讓收音機按鈕檢查 – jslover

+0

更新了答案 – atmd

+0

我做到了..但檢查選項已消失,當頁面刷新時 – jslover

0

您可以使用此cookie。這是一個普通的例子:

<body onload="pageLoad()"> 
    <form action="" id="avi"> 
     <input type="radio" name="sex" value="male">Male<br> 
     <input type="radio" name="sex" value="female">Female 
    </form> 
    <br></br> 

    <button type="button" id="bae" onclick="save()">save me </button> 

    <script> 
     var pageLoad = function() { 
      var savedValue = document.cookie.replace(/(?:(?:^|.*;\s*)sex\s*\=\s*([^;]*).*$)|^.*$/, "$1"); 

      if (savedValue === 'male') { 
       document.querySelector('#avi input[type="radio"][value="male"]').checked = true; 
      } 
      else if (savedValue === 'female') { 
       document.querySelector('#avi input[type="radio"][value="female"]').checked = true; 
      } 
     }; 

     var save = function() { 
      var m = document.querySelector('#avi input[type="radio"]:checked'); 
      if (m) 
       document.cookie = "sex=" + m.value; 
     } 
    </script> 
</body> 

一些其他的事情需要注意:在單擊處理

  • 你原來的代碼實際上並沒有選擇檢查無線電值 。您正在抓取表格的ID而不是當前選定的收音機的 。

  • 您可以在標記中的按鈕上添加處理程序而不是在
    中添加處理程序。這是很容易的,你正在編碼這個
    。如果您使用的是jQuery,我會放棄標記中的 處理程序,並將其替換爲準備好的 塊中的處理程序分配。

+0

它說'未捕獲的類型錯誤:無法讀取屬性'值'空' – jslover

+0

你只是檢查空,然後...答案更新。 – tjscience

0

您的單選按鈕是表單的一部分,表單將發送到服務器,並在返回時進行刷新。正因爲如此,你需要一個服務器端語言來知道客戶端檢查了什麼樣的單選按鈕,比如PHP,而且你不需要在數據庫中存儲任何東西。下面的代碼:

客戶端:MYWEBPAGE.PHP

<html> 
    <head> 
    </head> 
    <body> 
<?php 
// GET FROM SERVER WHAT RADIOBUTTON WAS CHECKED (IN ANY). 
$chk = $_SESSION["sex_checked"]; 
if (strcmp($chk,"male") == 0) 
    $male = "checked"; 
else $male = ""; 
if (strcmp($chk,"female") == 0) 
    $female = "checked"; 
else $female = ""; 
?> 
    <form action="myscript.php" method="post"> 
     <input type="radio" name="sex" value="male" <?php echo male; ?> />Male 
     <input type="radio" name="sex" value="female"<?php echo female; ?> />Female 
     <input type="submit" value="Save me" /> 
    </form > 
    </body > 
</html> 

服務器端:MYSCRIPT。PHP

<?php 
$_SESSION["sex_checked"] = $_POST["sex"]; // SAVE CHECKED RADIOBUTTON. 
header("Location: mywebpage.php"); // RETURN TO WEB PAGE (REFRESH). 
?> 
0

您需要設置和獲取價值

function setCookie(name, value, days) { // from http://www.quirksmode.org/js/cookies.html 
 
     if (days) { 
 
      var date = new Date(); 
 
      date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); 
 
      var expires = "; expires=" + date.toGMTString(); 
 
     } else var expires = ""; 
 
     document.cookie = name + "=" + value + expires + "; path=/"; 
 
    } 
 
    
 
    function getCookie(name) { 
 
     var nameEQ = name + "="; 
 
     var ca = document.cookie.split(';'); 
 
     for (var i = 0; i < ca.length; i++) { 
 
      var c = ca[i]; 
 
      while (c.charAt(0) == ' ') c = c.substring(1, c.length); 
 
      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 
 
     } 
 
     return null; 
 
    } 
 
    
 
    window.onload = function() { 
 
     var gender = getCookie('samplecookie'); 
 
     if (gender) { 
 
      if (gender=="male") document.getElementsByName('sex')[0].click(); // or .checked=true; 
 
      else if (gender=="female") document.getElementsByName('sex')[1].click(); 
 
     } 
 
     document.getElementById('bae').onclick = function() { 
 
      var m = document.getElementsByName('sex')[0]; 
 
      var f = document.getElementsByName('sex')[1]; 
 
      if (m.checked) { 
 
       setCookie('samplecookie', m.value, 30); 
 
      } else if (f.checked) { 
 
       setCookie('samplecookie', f.value, 30); 
 
      } 
 
     } 
 
    }
<form action="" id="avi"> 
 
<input type="radio" name="sex" value="male">Male<br> 
 
<input type="radio" name="sex" value="female">Female 
 
</form> 
 
<br></br> 
 

 
<button type="button" id="bae">save me </button>