2016-11-21 1 views
0

Как проверить, выбран ли какой-либо из трех элементов. У меня есть 2 список опций выглядит как этотКак проверить, выбран ли какой-либо из параметров в JavaScript

<div class="fruits"> 
     <select> 
      <option>apple</option> 
      <option>orange</option> 
      <option>banana</option> 
      <option>hello</option> 
      <option>Bye</option> 
     <select> 
    </div> 

    <div id="criteria"> 
     <select> 
      <option>fruits</option> 
      <option>in season</option> 
      <option>expensive</option> 
     </select> 
    </div> 

Я хочу, чтобы сделать «критерии» варианты Id только для чтения, если любой из трех вариантов яблоко, апельсин, банан не выбраны. Можно выбрать несколько вариантов в классе «фрукты». как пользователь может выбрать яблоко или привет, привет или пока, яблоко и банан.

Что может быть возможной логикой. Я пробовал немного подойти, как поддерживать объект с ключом, как яблоко, оранжевый и банановый, а значение - их количество кликов, а если count - 0 всех ключей, я бы спрятал другой тег параметра.

Я также пробовал другие подходы. код для этого здесь:

<script> 
    var count = 0; 
    fruitsList = document.getElementsByClassName("fruits"); 
    var countObj = { 
      apple: 0, 
      orange:0, 
      banana:0, 
     } 
    for(var i = 0; i<= fruitsList.length-1 ; i++){ 
     fruitsList[i].addEventListener("click", function(){ 
     \* have to grab the value of the elements because the list of elements is generated by PHP and there will be plenty of elements *\ 
    var threeOption = this.getAttribute("value"); 
      if(fourOption == 'apple' || fourOption == 'orange' || fourOption == 'banana'){ 
    if(this.selected == true){ 
        countObj[fourOption]++; 
        } 
       else if(this.selected == false){ 
        countObj[fourOption]--; 
       } 
       else{ 
        countObj[fourOption]--; 
       } 
      } 
    for (var key in countObj) { 
       if (Object.prototype.hasOwnProperty.call(countObj, key)) { 
        var val = countObj[key]; 
        if(val>0){ 
         count = 1; 
        } 
       } 
      } 
    if(count==1){ 
       for(var i = 0 ; i<=5 ; i++){ 
        document.querySelectorAll("#criteria option")[i].removeAttribute("disabled"); 
        } 
       } 
      else{ 
     for(var i = 0 ; i<=5 ; i++){ 
    document.querySelectorAll("#criteria option")[i].setAttribute("disabled","true"); 
     } 
     } 
    }); 
    } 
</script> 

варианты должны появиться, если снова любой из яблока, апельсина или банана перевыбранная и должен стать доступен только для чтения, если они не выбраны. Пожалуйста, предложите логику. В первый раз я отправляю вопрос. Пожалуйста, дайте мне знать, если я где-нибудь ошибаюсь, я буду счастлив исправить себя в будущем. Спасибо

ответ

0

Вам может понадобиться использовать getComputedStyle

Не тестировался, но вы можете попробовать это

function setElement(){ 
// pass the element 
window.onscroll = function(){scroll(element)}; 
} 

function scroll(elem){ 
eHeight = window.getComputedStyle(elem,null).getPropertyValue("height"); 
     //Rest of the code 
} 
+0

Как я могу использовать getComputedStyle в этом контексте? В любом случае, чтобы получить текущее состояние элемента, например, погоду, оно выбрано или нет. – Neetigya

0

Я нашел ответ. используя jQuery, мне удалось получить текущий выбор, а затем проверить, содержит ли текущий выбор яблоко, апельсин или банан. Вот ссылка на соответствующую функцию в документации API JQuery.

http://learn.jquery.com/using-jquery-core/faq/how-do-i-get-the-text-value-of-a-selected-option/