2012-12-04 37 views
0

這裏是在線樣本http://jsfiddle.net/bvJnM/ Somehow linkedin配置文件不會彈出。有人可以檢查我的代碼嗎?jQuery代碼塊彈出

function excerpt(str, nwords) { 
    var words = str.split(' '); 
    words.splice(nwords, words.length - 1); 
    return words.join(' ') + '&hellip;' + '<span>Show</span>'; 
} 

var $div = $('.container'); 
$div.each(function() { 
    var theExcerpt = excerpt($(this).text(), 30); 
    $(this).data('html', $(this).html()).html(theExcerpt); 
}); 

$('span').click(function() { 
    var isHidden = $(this).text() == 'Show'; 
    var $div = $(this).parent(); 
    var theExcerpt = excerpt($div.text(), 30); 
    $div.html(isHidden ? $div.data('html') : theExcerpt); 
    $(this).remove(); 
});​ 

HTML

<script src="//platform.linkedin.com/in.js" type="text/javascript"></script> 

<div class="container"> 
    Nulla varius diam at sem adipiscing pharetra. Integer eget nulla non purus commodo aliquam. Aenean sed nunc neque. Aliquam eleifend aliquam arcu, ac semper nulla faucibus id. Etiam luctus eleifend tempus. Vestibulum ornare, nisi vitae fermentum luctus, sem lectus rhoncus nibh, auctor iaculis magna turpis nec turpis. Aliquam orci tortor, vulputate at pretium sit amet, blandit eget libero. Sed posuere ultricies mi, sed rhoncus massa ultrices quis. Donec pulvinar vestibulum rhoncus. Donec urna lacus, mollis et convallis at, commodo nec lectus. Maecenas pretium, nunc ac volutpat tempus, dolor orci ultricies massa, eu malesuada urna massa ut orci. Duis eget elit nulla, ornare aliquet nulla. Sed eleifend scelerisque est, eu laoreet lacus ultricies id. Aenean aliquam porttitor augue, quis lacinia augue consequat vitae. Ut venenatis orci massa. Duis dignissim, justo at pellentesque adipiscing, ligula eros mollis tellus, ut accumsan lorem dui eu est. 
    <p></p> 
<script src="http://platform.linkedin.com/in.js" type="text/javascript"></script> 
<script type="IN/MemberProfile" data-format="click" data-id="http://www.linkedin.com/in/reidhoffman" 
data-format="inline" data-text="mynamehere"></script> 

擴大LinkedIn鏈接不起作用後...

回答

1

那麼讓我們試着這樣說:

把文本p標籤並做splicing-切塊。將腳本鏈接到自己的空間並隱藏它們。然後你展示完整的文本,也顯示LinkedIn的div。

<div class="container"> 
    <p>Nulla varius diam at sem adipiscing pharetra. Integer eget nulla non 
     purus commodo aliquam. Aenean sed nunc neque. </p> 
<div id="lin"> 
    <script src="http://platform.linkedin.com/in.js" 
       type="text/javascript"></script> 
<script type="IN/MemberProfile" data-format="click" 
       data-id="http://www.linkedin.com/in/reidhoffman" 
data-format="inline" data-text="mynamehere"></script> 
</div> 
</div> 

我已經更新這裏的小提琴:fiddle1

編輯:工作fiddle<span>附加到<p>,我使用$(this).parent().find('p')。它是$(this).parents('div').find('p')

+0

非常感謝您的答案,但鏈接不太好。一旦按下按鈕,文字內容就不會完整顯示文字。但這個想法很好。你會有很多人在某個階段修復鏈接網址嗎?再次感謝 – olo

+0

@olo我修復了代碼。檢查更新的小提琴。 – TheVillageIdiot