मानक ब्राउज़र प्रिंट को ओवरराइड करने और डिफ़ॉल्ट रूप से एक आईफ्रेम मुद्रित करने के लिए

मेरे पास एक आईफ़्रेम के अंदर एक दस्तावेज़ प्रकार पृष्ठ है। मैं केवल एक आईफ्रेम की सामग्री मुद्रित करने के लिए मानक ब्राउज़र प्रिंट (Ctrl + p) को ओवरराइड करने का प्रयास कर रहा हूं।मानक ब्राउज़र प्रिंट को ओवरराइड करने और डिफ़ॉल्ट रूप से एक आईफ्रेम मुद्रित करने के लिए

मुझे पता है कि जावास्क्रिप्ट का उपयोग कर एक iframe सामग्री मुद्रित करने के लिए:

window.frames['webcontent'].focus(); 
window.frames['webcontent'].print();

मुझे पता है कि मुद्रण जैसे पहले ही आ जाते जावास्क्रिप्ट करने के लिए जैसा कि यहां वर्णित है: Check for when a user has selected to print using javascript

कोई सलाह?

धन्यवाद

स्रोत

2014-07-25 Burjua

यह (जावास्क्रिप्ट का उपयोग करके) संभव नहीं है की तरह काम कर रहा है। आधुनिक ब्राउज़रों में उपयोगकर्ता द्वारा शुरू की गई प्रिंट घटनाओं के लिए कुछ प्रयोगात्मक समर्थन हैं, लेकिन are not cancelable ("सरल घटनाएं") ताकि संपूर्ण पृष्ठ अभी भी प्रिंट हो जाएगा भले ही आप ब्याज के फ्रेम को मुद्रित करने के लिए कस्टम कोड इंटरैक्ट करते हैं।

इस सीमा को देखते हुए, आपकी सबसे अच्छी शर्त शायद उपयोगकर्ताओं को एक बड़ा बटन प्रदान करने के लिए है जो आपके कस्टम फ्रेम प्रिंटिंग फ़ंक्शन को फायर करता है (printContentFrameOnly नीचे देखें, तर्क के बिना इसे आग लगें) और उम्मीद है कि वे ctrl-p के बजाय बटन का उपयोग करेंगे ।

यदि यह संभव होगा, इस तरह से यह करने के लिए (this answer के आधार पर) होगा:

// listener is a function, optionally accepting an event and 
// a function that prints the entire page 
addPrintEventListener = function (listener) { 

    // IE 5.5+ support and HTML5 standard 
    if ("onbeforeprint" in window) { 
     window.addEventListener('beforeprint', listener); 
    } 

    // Chrome 9+, Firefox 6+, IE 10+, Opera 12.1+, Safari 5.1+ 
    else if (window.matchMedia) { 
     var mqList = window.matchMedia("print"); 

     mqList.addListener(function (mql) { 
      if (mql.matches) listener(); // no standard event anyway 
     }); 
    } 

    // Your fallback method, only working for JS initiated printing 
    // (but the easiest case because there is no need to cancel) 
    else {  
     (function (oldPrint) { 
      window.print = function() { 
       listener(undefined, oldPrint); 
      } 
     })(window.print); 
    } 
} 

printContentFrameOnly = function (event) { 
    if (event) event.preventDefault(); // not going to work 
    window.frames['webcontent'].focus(); 
    window.frames['webcontent'].print(); 
} 

addPrintEventListener(printContentFrameOnly);

स्रोत

2014-07-28 13:18:14 Julian

मैं जावास्क्रिप्ट समाधान की तलाश में था, क्योंकि सीएसएस ने मेरे लिए काम नहीं किया था। इसे एक उत्तर के रूप में चिह्नित करना। – Burjua

धन्यवाद। इसके लायक होने के लिए, मैं पूरी तरह से सहमत हूं कि एक्सडीएनपी ने बक्षीस पुरस्कार के लायक हैं, और मैंने उनका जवाब भी उठाया। – Julian

आप मुद्रण के लिए एक सीएसएस फ़ाइल को परिभाषित कर सकते हैं:

@media print { 
    * { display: none; } 
    iframe { display: block; } 
    }

संपादित

Mybad फ्लॉप यह परीक्षण किया गया।

* { display: none; } is somehow overwriting all

लेकिन यह एक आकर्षण

http://jsfiddle.net/c4e3H/ 

    @media print { 
    h1, p{ display: none; } 
    }

स्रोत

2014-07-25 11:56:46 jungerislaender

नहीं, यह काम नहीं करता, सिर्फ एक खाली पेज प्रिंट करता है। क्रोम इस नियम के बावजूद आईफ्रेम सामग्री प्रिंट नहीं करता है, इसलिए मुझे नहीं लगता कि मैं इसे केवल सीएसएस के साथ कर सकता हूं। – Burjua

आपका पहला काम नहीं करता है क्योंकि '* {डिस्प्ले: कोई नहीं; } 'आपके 'iframe' (' html'/'body') के मूल तत्व छुपाता है। – cchamberlain

भाई, यह आसानी से सीएसएस के माध्यम से प्राप्त किया जा सकता: See thisJSfiddle: Tested

<style> 
@media print{ 
    body * {display:none;} 
    .toPrint{display:block; border:0; width:100%; min-height:500px} 
} 
</style>

एक HTML फ़ाइल होने दें:

<body> 
    <h3>I do not want this title Printed</h3> 
    <p> This paragraph should not be printed</p> 
    <iframe class="toPrint" src="http://akitech.org"></iframe> 
    <button onclick="window.print()">Print</button> 
</body>

स्रोत

2014-07-28 16:59:00 tika

'body * {} 'का उपयोग करके सीएसएस – tika

में सभी बॉडी तत्वों का चयन करता है। यह प्रिंट बॉडी पेज को प्रतिपादित करते समय सभी बॉडी तत्वों को छुपाता है ताकि केवल आईफ्रेम प्रदर्शित किया जा सके (दूसरे सीएसएस नियम के कारण)। यह आईफ्रेम के शरीर पर लागू नहीं होगा क्योंकि फ्रेम की मूल विंडो की सीएसएस पर इसका कोई असर नहीं है। – Slight

यह मेरे लिए क्रोम और आईई दोनों में सामग्री को क्रॉप करने वाले स्क्रॉलबार के साथ एक आईफ्रेम प्रिंट करता है। – cchamberlain

आईफ्रेम को छोड़कर और इसे पूरे दस्तावेज़ में फिट करने के लिए दस्तावेज़ में सभी सामग्री छिपाने का एकमात्र तरीका है।

<!DOCTYPE html> 
<html> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<style type="text/css"> 
body.hide *, body #backdrop 
{ 
    display: none !important; 
} 
body.hide #my_print_iframe, body.hide #backdrop 
{ 
    background: white; 
    position: fixed; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    border: 0; 
    width: 100%; 
    height: 100%; 
    display: block !important; 
} 
@media print { 
    body.hide #backdrop 
    { 
     display: none !important; 
    } 
} 
</style> 
    <script> 
    $(document).on('keydown', function(e){ 
     if (e.keyCode == 80 && (e.metaKey || e.ctrlKey)) { 
      $("body").addClass('hide'); 
      setTimeout(function(){ 
       $("body").removeClass('hide'); 
      },1000) 
     } 
    }) 
    </script> 
</head> 
<body> 
    <div> 
    this is some visible text 
    </div> 
    <iframe id="my_print_iframe" src="//example.com"></iframe> 
</body> 
</html>

मैं टाइमआउट (बुरा मुझे पता है) का इस्तेमाल किया क्योंकि कम से कम क्रोम 38 Ctrl + P

स्रोत

2014-08-03 01:30:38

हाय जा इस कोड को मदद मिलेगी सकता है ..

function PrintElem(elem) 
{ 
    Popup($(elem).html()); 
} 

function Popup(data) 
{ 
    var mywindow = window.open('', 'printMe', 'height=400,width=600'); 
    mywindow.document.write('<html><head><title>Print Me</title>'); 
    mywindow.document.write('</head><body >'); 
    mywindow.document.write(data); 
    mywindow.document.write('</body></html>'); 

    mywindow.print(); 
    mywindow.close(); 

    return true; 
}

के बाद KeyUp घटना नहीं भेजता है

और अपने पृष्ठ पर फ़ंक्शन PrintElem ('iframe') को कॉल करें।

स्रोत

2014-08-04 07:11:21 user2706194

विचार पृष्ठ पर कहीं भी आईफ्रेम सामग्री सेट करना है, और मूल सामग्री को छुपाकर केवल उस सामग्री को प्रिंट करना है।

यह Ctrl + P ईवेंट शुरू किया जा रहा है (जावास्क्रिप्ट के माध्यम से) iframe सामग्री प्राप्त करके किया जा सकता है, और केवल इसकी सामग्री (सीएसएस @media प्रकार के माध्यम से) प्रिंट करें।

एचटीएमएल कोड:

<div id="dummy_content"><!-- Here goes the iframe content, which will be printed --></div> 
    <div id="content_wrapper"> 
     <div id="current_content">Current Content that the user see<div> 
     <iframe id="myIframe" src="iframe.html"></iframe> 
    </div>

सीएसएस कोड:

@media screen { 
    #dummy_content { 
     display:none; /* hide dummy content when not printing */ 
    } 
}    
@media print { 
    #dummy_content { 
     display:block; /* show dummy content when printing */ 
    } 
    #content_wrapper { 
     display:none; /* hide original content when printing */ 
    } 
}

जावास्क्रिप्ट कोड:

 var dummyContent = document.getElementById("dummy_content"); 
     function beforePrint() { 
       var iFrame = document.getElementById("myIframe"); 
       dummyContent.innerHTML = iFrame.contentWindow.document.body.innerHTML; // populate the dummy content (printable) with the iframe content 
     } 

     document.onkeydown = function(e) { 
      if (e.ctrlKey && e.keyCode == 80) { 
       beforePrint(); 
      } 
     }

स्रोत

2014-08-04 11:51:06

मानक ब्राउज़र प्रिंट को ओवरराइड करने और डिफ़ॉल्ट रूप से एक आईफ्रेम मुद्रित करने के लिए

उत्तर

संबंधित मुद्दे