形式.each（）和.val（）jQuery循環

簡而言之，一旦。wrap div中的所有文本輸入都有一個值，我希望背景顏色變爲綠色。形式.each（）和.val（）jQuery循環

目前第一個.wrap div中的顏色不會變爲綠色，直到第二個。wrap div也有值？

請讓我知道我做錯了什麼。在輸入元素

<div class="wrap"> 
     <input type="text" /><br /> 
     <input type="text" /><br /> 
    </div> 
    <br /> 
    <div class="wrap"> 
     <input type="text" /><br /> 
     <input type="text" /><br /> 
     <input type="text" /><br /> 
    </div>

$('.wrap').each(function() { 
     $(this).change(function() { 
      var trigger = false; 
      $('input:text').each(function() { 
       if (!$(this).val()) { 
        trigger = true; 
       } 
      }); 
      trigger ? $('input:text').parent().css('background-color', 'red') : $('input:text').parent().css('background-color', 'green'); 
     }); 
    });

來源

2015-01-06 user3586946

當某人改變輸入值時，需要'$ .trigger（）'事件。不只是循環一次。 – DanFromGermany

<script> 

    $('input').each(function() { 
     check($(this)); 
    }); 

    $('textarea').each(function() { 
     check($(this)); 
    }); 

    function check($toCheck) { 
     $toCheck.change(function() { 

      var missingVal = false; 
      $toCheck.siblings().each(function() { 
       if($(this).context.nodeName == "INPUT") { 
        if(!$(this).val()) { 
         missingVal = true; 
        } 
       } 
      }) 

      if($(this).is(':checkbox')) { 
       if(!$(this).is(':checked')) { 
        missingVal = true; 
       } 
      } else { 
       if(!$(this).val()) { 
        missingVal = true; 
       } 
      } 

      if(missingVal) { 
       $(this).parent().css('background-color', 'red'); 
      } else { 
       $(this).parent().css('background-color', 'green'); 
      } 
     }); 
    } 

</script>

來源

2015-01-06 12:56:42

感謝這項工作很好，但現在它的工作如何添加，複選框和/或文本區域，仍然使其工作。 – user3586946

你可以做的正是與其他投入要素同樣的事情，你可能需要調整這行代碼，但是：如果（$（本）.context.nodeName ==「INPUT」）{ 喜歡的東西 if（$（this）.context.nodeName ==「INPUT」|| $（this）.context.nodeName ==「TEXTAREA」）{ –

我修改了原文，以便現在可以用於這些輸入類型。 –

綁定變化：

$(this).find('input').change(function() {

下面是完整的代碼與其他更改：

$('.wrap').each(function() { 
     $(this).find('input').change(function() { 
      var trigger = false; 
      var dish = $(this); 
      dish.each(function() { 
       if (!dish.val()) { 
        trigger = true; 
       } 
      }); 
      trigger ? dish.parent().css('background-color', 'red') : dish.parent().css('background-color', 'green'); 
     }); 
    });

來源

2015-01-06 12:37:03

首先，div元素沒有change事件。更改change處理程序放置到input元素來代替：

$(this).find('input').change(function() { ... });

其次，你$('input:text')選擇不是針對你遍歷.wrap元素，而是選擇所有input:text元素匹配上整個頁面。

將$('input:text')的所有實例更改爲$(this).parent().find('input:text')。

$(this).parent().find('input:text').each(function() { 
    if (!$(this).val()) { 
     trigger = true; 
    } 
});

這將選擇包含input元素有它change事件觸發（相關.wrap元素）的父母中的任何input:text元素。

來源

2015-01-06 12:37:16

謝謝。我不知道這個變化事件。 – user3586946

形式.each（）和.val（）jQuery循環

回答

相關問題