2016-11-03 7 views
0

ドロップダウンから選択して言語を選択する必要があります。両方の必須フィールドが満たされたら、私は選択した言語に基づいて、目的のリンクを「開く」必要があります。例えばラジオをチェックしてドロップダウンを選択し、URLリンクを決定して

:私は英語を選択した場合、それは私がフランス語を選択した場合、それは私が、これは両方必要な領域が、その前に埋められていることを確認するために取得できますか2.

URLに行きます、URL 1に行きますどこのリンク?

<form method="post" action=""> 
    <select id="option" required> 
    <option value="">Select</option> 
    <option value="option1"> Option 1</option> 
    <option value="option2"> Option 2</option> 
    </select> 

    <p>Choose a language:</p> 
    <label for="en">English</label> 
    <input type="radio" name="lang" id="lang-en" value="en" required><br> 
    <label for="fr">French</label> 
    <input type="radio" name="lang" id="lang-fr" value="fr"> 

    <input type="submit" id="submit-button" onclick="checkRequired()" value="Open"></input> 

<script> 
function checkRequired() 
{ 
if(document.getElementById('lang-en').checked) 
{ 
window.location="www.url1.com"; 
} 
else if(document.getElementById('lang-fr').checked) 
{ 
window.location="www.url2.com"; 
} 
} 
</script>   
</form> 

答えて

0

要素の値を取得し、値がある場合のみ処理します。

次のようなこと/ else文を構築することができます。

if ($('#option').val()) { 
    //do stuff 
} else { 
    //do nothing 
} 

を何もこの場合(ブールチェック)でfalseを返す何も返さないでしょう$('.option').val()を選択されていないものの。だから何も起こりません。

0

は、あなたの関数の開始時に以下の条件を含める:

if($('input[name=lang]:checked').length // checks if either one of the checkboxes are selected 
      && 
     $("#option").val() != "") // checks if the value from the select dropdown has been selected 
{ 


} 

また、明示的に特定のURLにリダイレクトするために選択した値をチェックする必要はありません。 jquery .data属性を使用して、選択したオプションから直接リダイレクトすることができます。

<select id="option" required> 
<option value="">Select</option> 
<option value="option1"> Option 1</option> 
<option value="option2"> Option 2</option> 
</select> 

<p>Choose a language:</p> 
<label for="en">English</label> 
<input type="radio" name="lang" id="lang-en" value="en" required data-url="www.url1.com"><br> 
<label for="fr">French</label> 
<input type="radio" name="lang" id="lang-fr" value="fr" data-url="www.url2.com"> 

<input type="submit" id="submit-button" value="Open"/> 
<script> 
$("#submit-button").click(function() 
{ 
    if($('input[name=lang]:checked').length > 0 && $("#option").val() != "")  
    window.location = $('input[name=lang]:checked').eq(0).data('url'); 
}); 
</script> 
+0

ありがとう。これは空のドロップダウンをチェックします。これは素晴らしいことです。私は一度提出すると何かにリンクしているようには見えませんが。 – user2230463

+0

正常に動作しているようです。 https://jsfiddle.net/5xz2ey78/ – DinoMyte

+0

フォームタグから削除して動作します!しかし、私はそれがPDFのリンクである場合、私はモバイルでダウンロードされません探しています。これに対する提案はありますか? – user2230463

関連する問題