Предотвращение дублирования выбора в нескольких выпадающих списках

Question

Я использую следующий скрипт, который отображает всплывающую ошибку, если человек выбрал одинаковые значения из нескольких выпадающих списков. Отлично работает, однако после показа всплывающего окна дублирующий выбор все еще имеет место. Это должно помешать этому.

$(document).ready(function() { 
    $('select').change(function() { 
     if ($('select option[value="' + $(this).val() + '"]:selected').length > 1) { 
      alert('You have already selected this option previously - please choose another.') 
     } 
    }); 
}); 

jsfiddle example here

Answer 1

Вы можете переключиться на вариант по умолчанию:

$(this).val('-1').change(); 

Надеется, что это помогает.

$(document).ready(function() { 
 
    $('select').change(function() { 
 
    if ($('select option[value="' + $(this).val() + '"]:selected').length > 1) { 
 
     $(this).val('-1').change(); 
 
     alert('You have already selected this option previously - please choose another.') 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option value='-1'>Choose an option</option> 
 
    <option value='1'>option 1</option> 
 
    <option value='2'>option 2</option> 
 
    <option value='3'>option 3</option> 
 
</select> 
 

 
<select> 
 
    <option value='-1'>Choose an option</option> 
 
    <option value='4'>option 4</option> 
 
    <option value='1'>option 1</option> 
 
    <option value='5'>option 5</option> 
 
</select>

Answer 2

Одним из вариантов является правопреемником значение 0, чтобы заставить выбрать новое значение, что-то вроде этого

jQuery(document).ready(function() { 

    $('select').change(function() { 

     if ($('select option[value="' + $(this).val() + '"]:selected').length > 1) 
     { 
      $(this).val(0); 
      alert('You have already selected this company - please choose another.') 
     } 
    }); 
});