單選按鈕驗證：javascript

我有一個註冊表單，並希望在性別部分單選按鈕上添加驗證。我的形式是像單選按鈕驗證：javascript

<form name="formreg" enctype="multipart/form-data" method="post"> 
    <input type="radio" value="male" name="gender" /> Male<br /> 
     <input type="radio" value="female" name="gender" /> Female<br /> 
     <input value="Submit" onclick="return inputval()" type="submit" /> 
    </form>

我使用下面的腳本，但不能正常工作..

<script type="text/javascript"> 
    function inputval(){ 
     if(document.getElementById("gender").checked=="false") 
     { 
      alert("Select at least male or female."); 
      return false; 
     } 
    } 
    </script>

無法找到問題。

來源

2013-03-22 likephp

看着你的JavaScript控制檯，並告訴我們的錯誤信息，請 – 2013-03-22 17:57:47

它沒有顯示任何錯誤......但還沒有工作 – likephp 2013-03-22 17:58:48

。在你的單選按鈕沒有性別標識。 – Vassilis 2013-03-22 17:59:39

你通過Id得到元素，而'gender'是你輸入的名字，而不是id。
代替

<input type="radio" value="male" name="gender" /> Male<br />

你應該使用

<input type="radio" value="male" id="gender" /> Male<br />

來源

2013-03-22 17:58:31

請詳細說明（：告訴OP他/她應該*做些什麼 – George 2013-03-22 17:59:50

與:checked試試這個：

<script type="text/javascript"> 
function inputval(){ 
    if($(':checked').length < 0) 
    { 
     alert("Select at least male or female."); 
     return false; 
    } 
} 
</script>

來源

2013-03-22 17:59:05 Jai

既然你這個標記與jQuery，使用:checked僞類選擇。

<script type="text/javascript"> 
function inputval() 
{ 
    if($("form[name='formreg'] input[type='radio']:checked").length != 1) 
    { 
     alert("Select at least male or female."); 
     return false; 
    } 
} 
</script>

來源

2013-03-22 18:00:10

你把jQuery放下了，所以我會用它。 document.getElementById('checked')不存在。即使這樣做，它也只適用於一個元素。您將不得不遍歷每個[name=gender]元素以查看是否有任何被檢查。 jQuery讓這個平凡：

$(".inputval").on('click', function (e) { 
    if (!$("[name=gender]:checked").length) { 
     alert('something something gender'); 
     e.preventDefault(); 
    } 
});

http://jsfiddle.net/ExplosionPIlls/s2YfU/

編輯：非jQuery的解決方案也很簡單，因爲querySelectorAll('[name=gender]:checked')工作過。

來源

2013-03-22 18:00:28

這真的很有幫助....正常工作 – likephp 2013-03-22 18:05:34

沒有必要validation.By默認選中一個單選按鈕

<form name="formreg" enctype="multipart/form-data" method="post"> 
    <input type="radio" value="male" name="gender" checked="true" /> Male<br /> 
     <input type="radio" value="female" name="gender" /> Female<br /> 
     <input value="Submit" onclick="return inputval()" type="submit" /> 
    </form>

來源

2013-03-22 18:02:06

@likephp看到我的代碼一次。這裏沒有必要驗證 – 2013-03-22 18:03:53

這撥弄可以給你一些想法（沒有jQuery的）。請注意，我檢查了其中一個按鈕，以便我可以向您顯示如果選中了某個按鈕，它會將anyChecked設置爲true。

<form name="formreg" enctype="multipart/form-data" method="post"> 
    <input type="radio" value="male" name="gender" checked="checked"/>Male 
    <br /> 
    <input type="radio" value="female" name="gender" />Female 
    <br /> 
    <input value="Submit" onclick="return inputval()" type="submit" /> 
</form> 
<div id="output"></div> 

var output = document.getElementById("output"); 
var genderInputs = document.getElementsByName("gender"); 
var anyChecked = false; 

for (var j = 0; j < genderInputs.length; j++) { 
    if (genderInputs[j].checked === true) { 
     anyChecked = true; 
     break; 
    } 
} 

output.textContent = "any checked: " + anyChecked;

http://jsfiddle.net/F8XGU/1/

來源

2013-03-22 18:37:00

單選按鈕驗證：javascript

回答

相關問題