Чередование классов с использованием jQuery Template - PullRequest
Новая
       15

Чередование классов с использованием jQuery Template

0 голосов
/ 13 декабря 2011

Я бы хотел, основываясь на массиве полученных данных, создать список из <li> элементов. Каждый из них будет иметь чередующийся класс «четный» или «нечетный». Вот что у меня пока так: 

<script id="news_template" type="text/x-jquery-tmpl">
    <li>
        {{= title }}
    </li>
</script>

Просматривая документацию, я не вижу ничего, что могло бы легко это сделать. Есть мысли?

Спасибо.

РЕДАКТИРОВАТЬ: Если бы я мог каким-то образом оценить сырой JavaScript, я мог бы просто установить переменную и основывать свой вывод на этом на каждой итерации. Я знаю, что у jQote2 есть эта особенность. Например, я мог бы сделать что-то вроде: 

<% even = !even; %>

... и затем основывать класс на состоянии этой переменной.

Ответы [ 2 ]

2 голосов
/ 13 декабря 2011

Я только что сделал это на прошлой неделе для таблицы с такой структурой: 

<table class='stripe' width='100%'>
  <!---awesome table with awesome rows and awesome columns--->
 < /table>

Итак, я использовал пару строк CSS: 

 tr.even {background-color: #DDD;  color:Black;}
 tr.odd {background-color: #fff; color:Black;}

Затем, используя jQuery: 

  $('table.stripe tbody tr:odd').addClass('odd');
  $('table.stripe tbody tr:even').addClass('even');

В вашем случае просто используйте: 

$ ('ul.stripe li:even').addClass('even');
$ ('ul.stripe li:odd').addClass('odd');

Что означает что-то вроде: «Пожалуйста, мистер jQuery, поместите нечетный или четный класс в зависимости от того, является ли tr нечетным или четным».

Надеюсь, это поможет!

0 голосов
/ 06 марта 2013 
        {{if ($index %2) == 0}}
            <div id="item odd">
        {{else}}
            <div id="item even">
        {{/if}}
...