2017-07-20 4 views
0

異なる名前とIDの2つのチェックボックスがあり、ボタンが無効になっていない場合、少なくとも1つはチェックしてもらいたい!しかし、そのうちの一つがチェックすると、それは他のファイルjavascriptで2つのチェックボックスを検証する方法

function validate(){ 
 
var time12 = document.getElementById("time12").checked; 
 
var time24 = document.getElementById("time24").checked; 
 

 
if((time12 == "") && (time24 == "")) 
 
{ 
 
\t alert("Choose your hour rate"); 
 
\t return false; 
 
} 
 
\t return true; 
 
}

 

 
<input id="time12" type="checkbox" name="time12" value="12" />12hours 
 
<input id="time24" type="checkbox" name="time24" value="24" />24hours

に進みますが、あなたはあなたの憎しみのコメントを入力する前に、私はあなたが私はすでにそれについて検索することを知らせたいと私は持っていません。このような同じ質問!

か私に他の方法を提案するには、ちょうどあなたの機能をonclick()を追加し、事前

+0

無効にする必要がありますどのようなボタン?私は2つのチェックボックスしか見ません。私は妥当性検査の方法を見ていますが、それを引き起こすものはありません。 –

+0

私はあなたが私のボタンを追加するのを忘れていたことに気がついたことをごめんなさい申し訳ありません... shimo

+0

私の質問を変えてください。( – shimo

答えて

0

でお願いします。

function validate(){ 
 
var time12 = document.getElementById("time12").checked; 
 
var time24 = document.getElementById("time24").checked; 
 

 
if((time12 == "") && (time24 == "")) 
 
{ 
 
\t alert("Choose your hour rate"); 
 
\t return false; 
 
} 
 
\t return true; 
 
}
<input id="time12" type="checkbox" name="time12" value="12" />12hours 
 
<input id="time24" type="checkbox" name="time24" value="24" />24hours 
 

 
<button onclick="validate()" >submit</button>

+0

投稿によると、いくつかのボタンが無効になるはずです –

+0

あなたの答えをありがとう!!私はそれが私がする必要があると想像できません... – shimo

+0

私は2つの数値属性を持っているので、この2つの数値が同じ変数を持っている場合は、 24時間 – shimo

0

あなたがチェックボックスのchangeイベントにイベントハンドラをアタッチする必要があり、この作業をするために。次に、要素のチェックされた状態に基づいてボタンを有効/無効にすることができます。私は単純に簡単に要素を選択するために、チェックボックスやボタンに#btnのIDにhoursのクラスを追加したことを

$('.hours').change(function() { 
 
    $('#btn').prop('disabled', !$('.hours:checked').length); 
 
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label> 
 
    <input id="time12" type="checkbox" name="time12" value="12" class="hours" /> 
 
    12hours 
 
</label> 
 
<label> 
 
    <input id="time24" type="checkbox" name="time24" value="24" class="hours" /> 
 
    24hours 
 
</label> 
 
<input type="submit" value="FORM 3" name="btn_form3" id="btn" />

注:これを試してみてください。

+0

ありがとう:)あなたの努力のために – shimo

0

チェックボックスをオンにするたびに、両方のチェックボックスがオンになっているかどうかを確認する必要があります。

これを行うには

$("input:checkbox").on("change", function(){ 
    var checked = false; 
    if($("#input1).prop("checked")) 
     checked = true; 
    if($("#input2).prop("checked")) 
     checked = true; 
    if(!checked) 
     button.prop("disabled",true); 
} 
+0

ありがとう:)あなたの努力のために – shimo

0

のようなその何かが、この例を参照してください:https://codepen.io/anon/pen/bRXMpx

<script> 
function validate(){ 
var time12 = document.getElementById("time12").checked; 
var time24 = document.getElementById("time24").checked; 

if((time12 == "") && (time24 == "")) 
{ 
    document.getElementById("btn").disabled = true; 
    alert("Choose your hour rate"); 
    return false; 
} 
else 
document.getElementById("btn").disabled = false; 
    return true; 
} 
</script> 
<html> 
<input id="time12" type="checkbox" onclick="validate()" name="time12" value="12" />12hours 
<input id="time24" type="checkbox" onclick="validate()" name="time24" value="24" />24hours 
<input type="submit" id="btn" value="FORM 3" onclick="validate()" name="btn_form3" > 
</html> 
関連する問題