Question

我使用javascript创建了摘录文本，我们首先与合同文本建立了“更多”链接。

点击更多后，它将切换并显示整个文字并显示“less”链接。

但是，当我尝试打印页面时，我在文档中获得了更多/更少的链接。

如何避免它？

这是我的代码：

<SCRIPT>
$(document).ready(function() {
var showChar = 60;
var ellipsestext = "...";
var moretext = "more";
var lesstext = "less";
$('.more').each(function() {
    var content = $(this).html();

    if(content.length > showChar) {

        var c = content.substr(0, showChar);
        var h = content.substr(showChar-1, content.length - showChar);

        var html = c + '<span class="moreelipses">'+ellipsestext+'</span>&nbsp;<span class="morecontent"><span>' + h + '</span>&nbsp;&nbsp;<a href="" class="morelink">'+moretext+'</a></span>';

        $(this).html(html);
    }

});

$(".morelink").click(function(){
    if($(this).hasClass("less")) {
        $(this).removeClass("less");
        $(this).html(moretext);
    } else {
        $(this).addClass("less");
        $(this).html(lesstext);
    }
    $(this).parent().prev().toggle();
    $(this).prev().toggle();
    return false;
});
});
</SCRIPT>

我试过这个打印按钮点击

function myprint() 
{
    //Get the print button and put it into a variable
    var printButton = document.getElementById("printpagebutton");
    //Set the print button visibility to 'hidden' 
    printButton.style.visibility = 'hidden';

    // This is the part where i need to change to toggle text, but not working
    $(".morelink").load(function(){
    if($(this).hasClass("less")) {
        $(this).removeClass("less");
        $(this).html(moretext);
    }
    $(this).parent().prev().toggle();
    $(this).prev().toggle();
    });

    //Print the page content
    window.parent.frames[0].focus();
    window.print();
    //Set the print button to 'visible' again 
    //[Delete this line if you want it to stay hidden after printing]
    printButton.style.visibility = 'visible';

}

解决方案：将以下代码放在myPrint（）函数中，而不是我之前使用的

$(".morelink").each(function(){
    $(this).parent().prev().toggle();
    $(this).prev().toggle();    
    });

Answer 1

尝试使用此

    @media print
    {
           .morelink {display:none;}
    }

只有在您打印页面而不在屏幕上时，才会应用上述css。同时尝试将文本div的css调整为100％，将媒体作为打印。

请参阅以下链接

http://www.w3schools.com/css/css_mediatypes.asp

http://www.w3schools.com/tags/att_style_media.asp

如何在文档中打印摘录文本时删除和切换更多/更少的链接

1 个答案: