Uncaught Error: Syntaxfehler, unerkannter Ausdruck: .tj_row_1, .tj_row_2, .tj_row_3, bei Function.Sizzle.error

Question

Ich benutze jquery plugin um Schieberegler Grid anzuzeigen, wenn ich jquery 1.6 benutze es funktioniert gut, wenn ich zu jquery 2.4 ändern. 1 es diesen Fehler zeigen:

nicht erfasste Fehler: Syntaxfehler, unerkannt Ausdruck: .tj_row_1, .tj_row_2, .tj_row_3, bei Function.Sizzle.error

nach Suche fand ich, dass Fehler durch diesen Teil des Codes verursacht :

pagination : function($wrapper, dir, opts) { 
        var config = $wrapper.data('config'); 

        if((dir === 1 && config.currentRow + opts.rows > config.totalRows) || 
         (dir === -1 && config.currentRow - 1 <= 0) 
        ) { 
         $wrapper.data('anim', false); 
         return false; 
        } 

        var movingRows = ''; 

        for(var i = 0; i <= opts.rows; ++i) { 
         (dir === 1) 
          ? movingRows += ".tj_row_" + (config.currentRow + i) + "," 
          : movingRows += ".tj_row_" + (config.currentRow + (i - 1)) + ","; 
        } 

        var seq_t = opts.type.factor, 
         $elements; 

        var dircond = 1; 
        if(opts.type.reverse) dircond = -1; 
        if(dir === dircond) { 
         $elements = $wrapper.children(movingRows); 
        }else { 
         $elements = $wrapper.children(movingRows).reverse(); 
        } 
        var total_elems = $elements.length, 
         cnt   = 0; 

        $elements.each(function(i) { 
         var $el   = $(this), 
          row   = $el.attr("class"), 
          animParam = {}, 

          currentRow = config.currentRow; 

         setTimeout(function() { 
// if first row fade out 
// if last row fade in 
// for all the rows move them up/down 
          if(dir === 1) { 
           if( row === "tj_row_" + (currentRow)) { 
            animParam.opacity = 0; 
           } 
           else if(row === "tj_row_" + (currentRow + opts.rows)) { 
            animParam.opacity = 1; 
           } 
          } 
          else { 
           if( row === "tj_row_" + (currentRow - 1)) { 
            animParam.opacity = 1; 
           } 
           else if(row === "tj_row_" + (currentRow + opts.rows - 1)) { 
            animParam.opacity = 0; 
           } 
          } 

          $el.show(); 

          (dir === 1) 
           ? animParam.top = $el.position().top - $el.height() + 'px' 
           : animParam.top = $el.position().top + $el.height() + 'px' 

          $el.stop().animate(animParam, opts.type.speed, opts.type.easing, function() { 
           if(parseInt(animParam.top) < 0 || parseInt(animParam.top) > $el.height() * (opts.rows - 1)) 
            $el.hide(); 

           ++cnt; 
           if(cnt === total_elems) { 
            $wrapper.data('anim', false); 
           } 
          }); 
         }, seq_t + i * seq_t); 
        }); 

        (dir === 1) ? config.currentRow += 1 : config.currentRow -= 1; 

        $wrapper.data('config', config); 
       } 

Answer 1

Das Problem ist aufgrund der nachfolgenden , auf der movingRows Selektor-Zeichenfolge.

Um dies zu beheben, Sie wäre besser, die Wähler in einem Array zu erstellen und join() sie dann vor dem Gebrauch, so etwas wie diese:

var config = { currentRow: 1 } 
 
var opts = { rows: 5 } 
 
var dir = 1; 
 

 
var classes = []; 
 
for (var i = 0; i < opts.rows; i++) { 
 
    var suffix = config.currentRow + (dir == 1 ? i : i - 1); 
 
    classes.push('.tj_row_' + suffix); 
 
} 
 

 
var movingRows = classes.join(','); 
 
console.log(movingRows);

Answer 2

das Problem im Wert war hier bestanden :.

(dir === 1)? $currentRowElements = $wrapper.children(currentRows) 
: $currentRowElements = $wrapper.children(currentRows).reverse(); 

die currentRows = "string of value" = tj_row_1, .tj_row_2, .tj_row_3, .tj_row_4, .t j_row_5

i konvertiert die Zeichenfolge Array dann i den nächsten Wert des Arrays erhalten:

 pagination : function($wrapper, dir, opts) { 
         var config = $wrapper.data('config'); 

         if((dir === 1 && config.currentRow + opts.rows > config.totalRows) || 
          (dir === -1 && config.currentRow - 1 <= 0) 
         ) { 
          $wrapper.data('anim', false); 
          return false; 
         } 

         var movingRows = ''; 

         for(var i = 0; i <= opts.rows; ++i) { 
          (dir === 1) 
           ? movingRows += '.tj_row_' + (config.currentRow + i) + ',' 
           : movingRows += '.tj_row_' + (config.currentRow + (i - 1)) + ','; 
         } 
         //var movingRows = opts.rows.map(function(v, i) { 
         // var suffix = config.currentRow + (dir == 1 ? i : i - 1); 
         // return '.tj_row_' + suffix; 
         //}).join(','); 

         var seq_t = opts.type.factor, 
          $elements; 

         var dircond = 1; 
         if(opts.type.reverse) dircond = -1; 
//convert to array 
         arr = movingRows.split(','); 
//function to get the next value of array 
         function nextSlide(num) { 
          var p=[]; 
          return p[($.inArray(num, p) + 1) % p.length]; 
         } 
         (dir === dircond) 
          ? $elements = $wrapper.children(nextSlide(arr)) 
          : $elements = $wrapper.children(nextSlide(arr)).reverse(); 

         var total_elems = $elements.length, 
          cnt   = 0; 

         $elements.each(function(i) { 
          var $el   = $(this), 
           row   = $el.attr('class'), 
           animParam = {}, 

           currentRow = config.currentRow; 

          setTimeout(function() { 
           // if first row fade out 
           // if last row fade in 
           // for all the rows move them up/down 
           if(dir === 1) { 
            if( row === 'tj_row_' + (currentRow)) { 
             animParam.opacity = 0; 
            } 
            else if(row === 'tj_row_' + (currentRow + opts.rows)) { 
             animParam.opacity = 1; 
            } 
           } 
           else { 
            if( row === 'tj_row_' + (currentRow - 1)) { 
             animParam.opacity = 1; 
            } 
            else if(row === 'tj_row_' + (currentRow + opts.rows - 1)) { 
             animParam.opacity = 0; 
            } 
           } 

           $el.show(); 

           (dir === 1) 
            ? animParam.top = $el.position().top - $el.height() + 'px' 
            : animParam.top = $el.position().top + $el.height() + 'px' 

           $el.stop().animate(animParam, opts.type.speed, opts.type.easing, function() { 
            if(parseInt(animParam.top) < 0 || parseInt(animParam.top) > $el.height() * (opts.rows - 1)) 
             $el.hide(); 

            ++cnt; 
            if(cnt === total_elems) { 
             $wrapper.data('anim', false); 
            } 
           }); 
          }, seq_t + i * seq_t); 
         }); 

         (dir === 1) ? config.currentRow += 1 : config.currentRow -= 1; 

         $wrapper.data('config', config); 
        }