3つの選択ボックスを実装し、JavaScriptで選択を処理する方法は？

1つのボックスで選択された値が次の選択ボックスに表示されないように、3つの選択ボックスをページに実装する必要があります。コードでこれを詳細に説明できますか？ JSの初心者。これがPHPでもできるのかどうか教えてください。前もって感謝します。ここは、サンプルコードを行く...そのは、JSスクリプトを取っていない理由を私に教えてください：この答えはあなたのクエリを解決します3つの選択ボックスを実装し、JavaScriptで選択を処理する方法は？

<html> 
    <head> 
<title>check</title> 
<body> 


<select name="name[]" class="select"> 
    <option value="">Select</option> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 
<select name="name[]" class="select"> 
    <option value="">Select</option> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 
<select name="name[]" class="select"> 
    <option value="">Select</option> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 

<script> 
$('select').change(function() { 
    var myOpt = []; 
    $("select").each(function() { 
     myOpt.push($(this).val()); 
    }); 
    $("select").each(function() { 
     $(this).find("option").prop('hidden', false); 
     var sel = $(this); 
     $.each(myOpt, function(key, value) { 
      if((value != "") && (value != sel.val())) { 
       sel.find("option").filter('[value="' + value +'"]').prop('hidden', true); 
      } 
     }); 
    }); 
}); 
</script> 

</body> 
</head> 
</html>

出典

2016-03-25 Anand Shankar

あなたが最初に選択した後、次の選択ボックスの値が最初の選択に基づいて表示されますか？ –

ええ..次の選択ボックスは、最初の選択ボックスで選択された値を表示するべきではありません。 –

まず第一に、何か違いを生む選択ボックスにIDを与える –

ホープ：

$('select').change(function() { 
    var val = $(this).val(); 

    $("select").not(this).each(function(index, item) { 
     $(item).find("option[value='" + val + "']").remove(); 
    }); 
});

それともあなたはjsfiddleリンクに通過することができますライブデモ

出典

2016-03-25 06:44:43 ali

私はあなたが提供した同じURLからこれを試しました。しかし、私はステップガイダンスで一歩を欲しい。ありがとうございます私が提供したコードでどこが間違っているかを教えてください。 –

最初にjquery libをダウンロードする必要がありますか？ –

はい、jQueryのライブラリを最初に@AnandShankarを含める必要があります –

なぜ複数の選択ボックスを使用しないのですか？

<select multiple name="name[]" class="select"> 
    <option value="">Select</option> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select>

出典

2016-03-25 08:17:36

できます。私は選択した値を持つ3つの選択ボックスを次に表示してから次に表示しないようにする必要があります。 –

hi ..データベースから来る同じデータを持つ3つの選択ボックスを追加する必要があります。どのようにwhileループでこれを行うには？コードの助け？ –

3つの選択ボックスを実装し、JavaScriptで選択を処理する方法は？

答えて

関連する問題