Pinterest的小部件與jQuery的標籤衝突

我想把Pinterest的小部件放到我的網站上使用jQuery的標籤，但它不顯示任何東西。但是，當我把它放在標籤之外時，它就起作用了。Pinterest的小部件與jQuery的標籤衝突

我用這jQuery代碼：

<script="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 

    //Default Action 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 

    //On Click Event 
    $("ul.tabs li").click(function() { 
     $("ul.tabs li").removeClass("active"); //Remove any "active" class 
     $(this).addClass("active"); //Add "active" class to selected tab 
     $(".tab_content").hide(); //Hide all tab content 
     var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content 
     $(activeTab).fadeIn(); //Fade in the active content 
     return false; 
    }); 
}); 
</script>

這對於Pinterest的（第二行是正如所指示的身體標記以上）：

<a data-pin-do="embedUser" href="http://pinterest.com/thisismycyprus/"></a> 
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

這是標籤代碼

<ul class="tabs"> 
    <li><a href="#tab1">Tab 1</a></li> 
    <li><a href="#tab2">Tab 2</a></li> 
</ul> 
<div class="tab_container"> 
    <div id="tab1" class="tab_content"><h2>Tab 1</h2><p>Content </p></div> 
    <div id="tab2" class="tab_content"><h2>Tab 2</h2><p><a data-pin-do="embedUser" href="http://pinterest.com/thisismycyprus/"></a></p></div> 
</div>

來源

2013-03-26 user2212572

你可以包括你的標籤的標記呢？ – couzzi 2013-03-27 04:09:30

添加了標籤代碼 – user2212572 2013-03-27 06:33:51

您已添加腳本$(window).load(function(){ });檢查this fiddle

//<![CDATA[ 
$(window).load(function(){ 
//Default Action 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 

    //On Click Event 
    $("ul.tabs li").click(function() { 
     $("ul.tabs li").removeClass("active"); //Remove any "active" class 
     $(this).addClass("active"); //Add "active" class to selected tab 
     $(".tab_content").hide(); //Hide all tab content 
     var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content 
     $(activeTab).fadeIn(); //Fade in the active content 
     return false; 
    }); 
});//]]>

來源

2013-03-27 06:46:33 Sender

加載時有一個小延遲，但它的工作原理！ – user2212572 2013-03-27 07:00:55

我的答案是關於Pinterest的/ JQuery的（不是jQuery的選項卡）

我曾在一個幻燈片使用Pinterest的飼料窗口小部件（http://business.pinterest.com/widget-builder/#do_embed_pin），我得到了同樣的錯誤：當DIV容器在頁面加載時爲display:none;，Pinterest內容爲空。

我用visibility:hidden;，而不是在我的div容器，初始化我的幻燈片（這開始前等待4秒），設置display:none;visibility:visible;，然後我可以使用jQuery show();/hide();

來源

2013-08-20 18:49:17 sglessard

Pinterest的小部件與jQuery的標籤衝突

回答

相關問題