0

当谈到 jQuery 时,我是个大菜鸟,我在这里非常需要帮助。

由于它是一个简单的原型,每个选择将有 2 个选项。如果用户从 BOTH select 中选择第二个选项,然后触发提交,将显示一个隐藏的 div 并将屏幕滚动到它。

如果用户尝试在未选择这两个选项的情况下按下提交,则会在未选择的选项上方弹出错误消息

我在 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>

任何人都可以帮我一把吗?我的主要问题是获取这两个值然后输入将起作用,或者显示错误消息......

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 回答