jQuery nth-child селектор - PullRequest
       29

jQuery nth-child селектор

6 голосов
/ 27 мая 2011

Есть небольшая запутанная проблема с jQuery и выбором / стилизацией столбца в таблице.

Следующий код работает:

   $(function() {
      $("table").delegate('th.selcol','click', function(e) {
         var iCol = $(this).parent().children().index(this)+1;
         $("table tr td:nth-child(10)").each(function () {
            $(this).toggleClass("colhighlight");
         });
      });
   });

Но этот код изменяет nth-child (10) для nth-child (iCol) выдает ошибку «uncaught exception: синтаксическая ошибка, нераспознанное выражение:: nth-child»

   $(function() {
      $("table").delegate('th.selcol','click', function(e) {
         var iCol = $(this).parent().children().index(this)+1;
         $("table tr td:nth-child(iCol)").each(function () {
            $(this).toggleClass("colhighlight");
         });
      });
   });

Любая помощь будет принята с благодарностью.

Ответы [ 4 ]

15 голосов
/ 27 мая 2011
     $("table tr td:nth-child(" + iCol + ")").each(function () {
        $(this).toggleClass("colhighlight");
     });

nth-child ожидает целое число, а не строку, поэтому вы можете использовать конкатенацию для решения вашей проблемы.

3 голосов
/ 27 мая 2011

Попробуйте это:

"table tr td:nth-child("+iCol+")"
2 голосов
/ 27 мая 2011

Измените это на это:

  $(function() {
    $("table").delegate('th.selcol','click', function(e) {
       var iCol = $(this).parent().children().index(this)+1;
       $("table tr td:nth-child(" + iCol + ")").each(function () {
         $(this).toggleClass("colhighlight");
       });
    });
  });
0 голосов
/ 27 мая 2011

попробуйте это:

   $(function() {
      $("table").delegate('th.selcol','click', function(e) {
         var iCol = $(this).parent().children().index(this)+1;
         $("table tr td:nth-child("+iCol+")").each(function () {
            $(this).toggleClass("colhighlight");
         });
      });
   });

Надеюсь, что это работает:)

...