jQuery,计算子项并在悬停时显示结果

时间:2015-10-19 07:14:06

标签: javascript jquery magento

我意识到产品的字母搜索。点击信件后,所有以信件开头的产品都会显示。 但我会把它放在信的顶部并隐藏起来。

我是否必须使用函数hover()和append()以及如何使用?

这是我的代码:

_alphabets.hover(function(){
var _letter = $x(this), _text = $x(this).text(), _count = 0;

_contentRows.removeClass("lignetrouve");

_contentRows.each(function(i) {
var _cellText = $x(this).children('td').eq(0).text();
if ( RegExp('^' + _text).test(_cellText) ) {
_count += 1;
list = $x(this).addClass("lignetrouve");
}

}); /*end _contentRows.each(function(i) */

//we count number of child
_nblignes = $x('.lignetrouve').length;

//display
$x('.compteur').append(_nblignes);

})

感谢。

1 个答案:

答案 0 :(得分:0)

我找到了:

 _alphabets = $x('.alphabet > a');
 _contentRows = $x('#produits-table tbody tr');


_alphabets.click(function() {   
    var _letter = $x(this), _text = $x(this).text(), _count = 0;
    //Ajout de la class active a la lettre plutot qu'a l'alphabet entier
    _alphabets.removeClass("active");
    _letter.addClass("active");
    _contentRows.removeClass("lignetrouve");


    if (($x('#noproduct').length == 0) && ($x('.lignetrouve').length == 0)) {
    $x('tbody').append('<tr id="noproduct"><td>Aucun produit</td></tr>');
    };

    _contentRows.hide();

    _contentRows.each(function(i) {
        //Affectation de la variable celltext qui contient le contenu 
        var _cellText = $x(this).children('td').eq(0).text();
        //Si le debut commence comme la lettre selectionnée
        if (  RegExp('^' + _text).test(_cellText) ) {
            _count += 1;
            list = $x(this).fadeIn(400);
            list.addClass("lignetrouve");
            $x('#noproduct').remove();

        } 

    _nblignes = $x('.lignetrouve').length;

    $x(this).attr('data-title',_nblignes);


    }); /*end  _contentRows.each(function(i) */


}); /*end _alphabets.click(function() */

_alphabets.hover(function(){
    _contentRows.removeClass("lignetrouve");

    var _letter = $x(this), _text = $x(this).text(), _count = 0;


    _contentRows.each(function(i) {

        var _cellText = $x(this).children('td').eq(0).text();


        if (  RegExp('^' + _text).test(_cellText) ) {
            _count += 1;
            //on ajoute une class pour le calcul
            list = $x(this).addClass("lignetrouve");

        } 
    }); /*end  _contentRows.each(function(i) */


    _nblignes = $x('.lignetrouve').length;


    $x(this).attr('data-title',_nblignes);

}); /*end _alphabets.hover(function() */

Jsfiddle