Jquery只处理第一个函数/代码块

Jquery only processing first function/block of code

本文关键字：代码 函数 第一个 处理 Jquery      更新时间：2023-09-26

我有一个包含三个不同的jquery代码片段的页面，它们都做不同的事情。问题是，当它们都在页面上时，只有第一个有效。我已经改变了顺序，不管代码片段是什么，只有第一个有效。是否有一个内部的jquery冲突我错过了?

我代码:

<script type="text/javascript"> 
jQuery(document).ready( function() {
    $("#main-menu li").mouseenter(function() {  
        $(this).find("ul").fadeIn();
    }).mouseleave(function(){
      $(this).parent().find("ul").fadeOut();
    });
    jQuery( ".text-resize a" ).textresizer({
         target: ".content",
         type: "fontSize",
         sizes: [ "12px", "16px" ],
         selectedIndex: 0
    });
    jQuery( ".text-resize a" ).textresizer({
         target: ".title",
         type: "fontSize",
         sizes: [ "11px", "16px" ],
         selectedIndex: 0
    });
    jQuery( ".text-resize a" ).textresizer({
         target: ".show-more",
         type: "fontSize",
         sizes: [ "12px", "16px" ],
         selectedIndex: 0
    });
    jQuery( ".text-resize a" ).textresizer({
         target: "#footer",
         type: "fontSize",
         sizes: [ "12px", "16px" ],
         selectedIndex: 0
    }); 
    jQuery( ".text-resize a" ).textresizer({
         target: ".copyright",
         type: "fontSize",
         sizes: [ "11px", "16px" ],
         selectedIndex: 0
    }); 
        $(".slidetabs").tabs(".images > div", {
        // enable "cross-fading" effect
        effect: 'fade',
        fadeOutSpeed: "2000",
        // start from the beginning after the last tab   
        rotate: true          
    // use the slideshow plugin. It accepts its own configuration
    }).slideshow( {autoplay: true, interval:3000});
});     
</script>

谢谢

我假设你正在使用这个textResizer插件。你真的应该使用type="cssClass"，如果你要针对不同大小的页面的不同部分。

jQuery( ".text-resize a" ).textresizer({
     target: "body",
     type: "cssClass",
     sizes: [ "size1", "size2" ],
     selectedIndex: 0
});

你的CSS看起来像

body.size1 .content { font-size: 12px;}
body.size2 .content { font-size: 16px;}
body.size1 .title { font-size: 11px;}
body.size2 .title { font-size: 16px;}
body.size1 .show-more { font-size: 12px;}
body.size2 .show-more { font-size: 16px;}
body.size1 #footer { font-size: 12px;}
body.size2 #footer { font-size: 16px;}
body.size1 .copyright { font-size: 11px;}
body.size2 .copyright { font-size: 16px;}

最好将相同的

的CSS组合在一起。
body.size1 .title,
body.size1 .copyright { font-size: 11px;}
body.size1 .content,
body.size1 #footer,
body.size1 .show-more { font-size: 12px;}
body.size2 .content,
body.size2 .title,
body.size2 .show-more,
body.size2 #footer,
body.size2 .copyright { font-size: 16px;}
相关文章：