jQuery resize()问题

时间:2016-11-23 18:29:39

标签: jquery substr window-resize

我在resize函数中有一些函数,我无法在某些窗口大小调整场景中使这些函数按预期工作。例如,当页面加载窗口宽度> 1001并调整窗口宽度< 500,调整大小功能内部的功能不再正常工作。不起作用的功能与文本显示有关,绑定到按钮。

我需要帮助查找为什么这些功能无法正常工作。

这是一个小提琴 - https://jsfiddle.net/carbot3000/tuttjLp2/11/

在小提琴中,您需要调整输出容器的大小以了解我在说什么。以非常大的宽度开始,然后将其调整为< 500px(小)。

以下是功能 -

jQuery(document).ready(function() {

    jQuery(window).resize(function() {
         checkScreenSize();
    });

    checkScreenSize();

    function checkScreenSize() {
        var newWindowWidth = jQuery(window).width();

        if (newWindowWidth > 1001) {
            var showChar = 700; // How many characters are shown by default
            jQuery('.reviewbody').each(function() {
                 var rvwElem = jQuery(this);
                 var fullVal = rvwElem.html();
                 var truncatedVal = fullVal.substr(0, showChar);
                 console.log(fullVal);
                 console.log(fullVal.length);

                 if (fullVal.length > showChar) {
                    jQuery(rvwElem).parent(".mySlides").find('.btnMore').first().show().on('click', function() {
                        jQuery(this).html(jQuery(this).text() == 'View Less' ? 'View More' : 'View Less');
                        jQuery(".home_testimonial_section .home_testimonial_slider_wrap").toggleClass("rvwHeight");
                        jQuery(rvwElem).html(jQuery(rvwElem).html() == truncatedVal ? fullVal : truncatedVal);
                        console.log(fullVal);
                        console.log(fullVal.length);
                    });
                 }

                // You still want to show the content if it is shorter than "showChar"
                jQuery(rvwElem).html(truncatedVal);
                console.log(truncatedVal);
            });
        } else if (newWindowWidth < 500) {
            var showChar = 200; // How many characters are shown by default

            jQuery('.reviewbody').each(function() {
                var rvwElem = jQuery(this);
                var fullVal = rvwElem.html();
                var truncatedVal = fullVal.substr(0, showChar);
                console.log(fullVal);
                console.log(fullVal.length);

                if (fullVal.length > showChar) {
                    jQuery(rvwElem).parent(".mySlides").find('.btnMore').first().show().on('click', function() {
                        jQuery(this).html(jQuery(this).text() == 'View Less' ? 'View More' : 'View Less');
                        jQuery(".home_testimonial_section .home_testimonial_slider_wrap").toggleClass("rvwHeight");
                        jQuery(rvwElem).html(jQuery(rvwElem).html() == truncatedVal ? fullVal : truncatedVal);
                        console.log(fullVal);
                        console.log(fullVal.length);
                    });
                }

                // You still want to show the content if it is shorter than "showChar"
                jQuery(rvwElem).html(truncatedVal);
                console.log(truncatedVal);
            }); 

 }
  }
});

0 个答案:

没有答案