Форум

derevo · #11 (**permalink**) 15.03.2016, 07:58

Спасибо, это работает!
А подскажи как добавить еще цикл, чтобы вместо ".tr10", ".tr11", ... тут значения сами перебирались:

[".tr10", ".tr11", ".tr12", ".tr13"].forEach(function(a) {

У меня есть такой код:
Php:

$trnumber = 20;

Script:

var trnumber = 0;
while (trnumber < <?php echo $trnumber ?>) {
  $('.tr'+trnumber).css('height', '');
  $('.tr'+trnumber).height( getMaxHeight($('.tr'+trnumber)) );
  trnumber++;
}

Как можно добавить подобный цикл в твой код?
типа, как:

window.addEventListener("DOMContentLoaded", function() {
    var b = document.querySelector("#filter");
    //var trnumber = 0;
    b.addEventListener("change", function() {
	//while (trnumber < <?php echo $trnumber ?>) {
        //[".tr"+trnumber].forEach(function(a) {
        [".tr10", ".tr11", ".tr12", ".tr13"].forEach(function(a) {
            a = document.querySelectorAll(a);
            var c = a[1].innerHTML,
                c = b.checked && [].every.call(a, function(a, b) {
                    return !b || a.innerHTML == c
                }) ? "add" : "remove";
            [].forEach.call(a, function(a) {
                a.classList[c]("hide")
            })
        })
		//trnumber++;
    //}
	})
});

рони · #12 (**permalink**) 15.03.2016, 08:31

derevo,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
     .hide {
        display: none;
     }

        {

       }
  </style>

</head>

<body>
<input id="filter" type="checkbox">только отличия
<div class="cd-products-table">
   <div class="feateres">
      <ul class="cd-feateres-list">
         <li class="osnovtr tr10">Тип акустики</li>
         <li class="osnovtr tr11">Количество полос</li>
         <li class="osnovtr tr12">Мощность номинальная</li>
         <li class="osnovtr tr13">Мощность максимальная</li>
      </ul>
   </div>
   <div class="cd-products-wrapper">
      <ul class="cd-products-coliumns">
         <li class="product">
            <ul class="cd-feateres-list">
               <li class="osnovtd tr10">коаксиальная</li>
               <li class="osnovtd tr11">2</li>
               <li class="osnovtd tr12">60 Вт</li>
               <li class="osnovtd tr13">180 Вт</li>
            </ul>
         </li>
         <li class="product">
            <ul class="cd-feateres-list">
               <li class="osnovtd tr10">коаксиальная</li>
               <li class="osnovtd tr11">2</li>
               <li class="osnovtd tr12">30 Вт</li>
               <li class="osnovtd tr13">90 Вт</li>
            </ul>
         </li>
         <li class="product">
            <ul class="cd-feateres-list">
               <li class="osnovtd tr10">коаксиальная</li>
               <li class="osnovtd tr11">2</li>
               <li class="osnovtd tr12">60 Вт</li>
               <li class="osnovtd tr13">240 Вт</li>
            </ul>
         </li>
      </ul>
   </div>
</div>

<script>
window.addEventListener("DOMContentLoaded", function() {
    var b = document.querySelector("#filter");
    b.addEventListener("change", function() {
        [].forEach.call(document.querySelectorAll('.feateres li'),function(a,k) {
            a = document.querySelectorAll('.cd-feateres-list li:nth-child('+(k+1)+')');
            var c = a[1].innerHTML,
                c = b.checked && [].every.call(a, function(a, b) {
                    return !b || a.innerHTML == c
                }) ? "add" : "remove";
            [].forEach.call(a, function(a) {
                a.classList[c]("hide")
            })
        })
    })
});

</script>
</body>

</html>

derevo · #13 (**permalink**) 15.03.2016, 08:43

Спасибо. Теперь все ок.

А я вот как забабахал, тоже заработало

function toggleCompare(objCheckbox) {
	var chboxfilter = document.querySelector('.filter_otlich');
	var trnumber = 1;
	while (trnumber < <?php echo $trnumber ?>) {
	var newtrnumber = '.tr'+trnumber;
	[newtrnumber].forEach(function(trfilter) {
		trfilter = document.querySelectorAll(trfilter);
		var cfilter = trfilter[1].innerHTML,
			cfilter = chboxfilter.checked && [].every.call(trfilter, function(trfilter, chboxfilter) {
				return !chboxfilter || trfilter.innerHTML == cfilter
			}) ? 'add' : 'remove';
		[].forEach.call(trfilter, function(trfilter) {
			trfilter.classList[cfilter]('hide')
		})
	})
	trnumber++;
	}
}

фигня?

рони · #14 (**permalink**) 15.03.2016, 08:52

derevo,
как вам удобнее

derevo · #15 (**permalink**) 15.03.2016, 08:59

т.е. получается без разницы? как отблагодарить?

Форум

Справочник

Discord чат

Курсы javascript