0

jQueryに関しては、大きな初心者です。ここで助けを大いに必要としています。

単純なプロトタイプであるため、各選択には2つのオプションがあります。ユーザーが両方の選択から2番目のオプションを選択し、送信をトリガーすると、非表示のdivが表示され、画面がそこまでスクロールされます。

ユーザーがこれらの2つのオプションを選択せず​​に送信を押そうとすると、選択されていないオプションの上にエラーメッセージが表示されます。

私はhtmlでこのような静かな何かを考えています

<style>
    .surprise {
        display: none;
    }
    .error {
        display: none;
    }
</style>

 <form>
     <select>
         <option>Please Select Your Value</option>
         <option>Pick this value 1</option>
     </select>
     <div class="error">Please select your value</div>

     <select>
         <option>Please Select Your Value</option>
         <option>Pick this value 2</option>
     </select>
     <div class="error">Please select your value</div>

     <input type="submit" value="Show Hidden Div" />         
 </form>

 <div class="suprise">
   Hidden Div
 </div>

誰でも私に手を差し伸べることができますか？私の主な問題は、これら2つの値を取得すると、入力が機能するか、エラーメッセージが表示されることです...

4

1 に答える 1

1

テストしていません：

 //add this id to submit or use your own

 $('#submit').click(function(){

   $('.error').hide();
   $('.surprise').hide();

   var correct = true;
   $('select').each(function(){
     // the option2value is presumed to always be the same as in <option value="option2value" >Text</option
     if($(this).val() != 'option2value'){
       //next is the error... it might be better to use an id there
       $(this).next().show();
       correct = false;
     }
   })
   if(correct){
     $('.surprise').show();
   }
 })
于 2012-09-28T19:24:18.180 に答える