如何使用jQuery或JavaScript打印更改的div

我有一個div，其中我可以通過更改其十六進制值來控制顏色，但是如何將其打印爲我選擇的顏色而不是原始顏色I曾經在div？如何使用jQuery或JavaScript打印更改的div

例如：我div是白色。我改變了顏色紅色和我有一個按鈕，可以讓我打印div，但它表明我，我打印白色div代替紅色之一。

<script language="JavaScript"> 
var gAutoPrint = true; // Tells whether to automatically call the print function 

function printSpecial() 
{ 
if (document.getElementById != null) 
{ 
var html = '<HTML>\n<HEAD>\n'; 

if (document.getElementsByTagName != null) 
{ 
var headTags = document.getElementsByTagName("head"); 
if (headTags.length > 0) 
html += headTags[0].innerHTML; 
} 

html += '\n</HE>\n<BODY>\n'; 

var printReadyElem = document.getElementById("printReady"); 

if (printReadyElem != null) 
{ 
html += printReadyElem.innerHTML; 
} 
else 
{ 
alert("Could not find the printReady function"); 
return; 
} 

html += '\n</BO>\n</HT>'; 

var printWin = window.open("","printSpecial"); 
printWin.document.open(); 
printWin.document.write(html); 
printWin.document.close(); 
if (gAutoPrint) 
printWin.print(); 
} 
else 
{ 
alert("The print ready feature is only available if you are using a browser. Please 
update your browser."); 
} 
} 

</script>

這是我的按鈕，並選擇div：

<div id="printReady"> 

div I want to print 
</div> 

<a href="javascript:void(printSpecial())" style="position:absolute">Print this Page</a>

來源

2012-10-15 Jun Jin

附加樣式標籤？ – mplungjan

如果我明白你的問題，你可以添加在printSpecial（）這行代碼的頂部：

$('#printReady').css('background', '#ff0000');

雖然控制這種事情的一種更好的方法是使用風格。

<style> 
    .ready { 
    background: #ffffff; 
    } 

    .printing { 
    background: #ff0000; 
    } 
</style>

然後你可以使用jQuery.addClass和jQuery.removeClass。這樣你就可以把你的CSS變成任何你想在兩個「狀態」中都有的東西。當你想改回去

$('#printReady').removeClass('ready'); 
$('#printReady').addClass('printing');

，然後反向：

然後，您這樣做是爲了改變風格。

來源

2012-10-15 09:22:37 TheRocketSurgeon

感謝您的輸入！ –

添加風格

html += '<style>* { color: red }</style>';

例如

來源

2012-10-15 09:24:32 mplungjan

感謝您的輸入！ –

不客氣。請參閱[如何接受答案的工作？]（http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work） – mplungjan

如何使用jQuery或JavaScript打印更改的div

回答

相關問題