인쇄용 버전이 작동하지 않습니다.

흥미로운 브라우저 문제로 실행 - jQuery를 구현하여 일반 스타일보기 CSS 파일과 인쇄용 CSS 파일 사이에서 단추를 클릭하여 페이지의 스타일 시트 링크 href를 전환 할 수 있습니다. 뷰어가 인쇄용 버전으로 이동하면 새로운 링크 href가 적용된 후 window.print()를 호출한다는 점을 제외하고는 작동합니다. 인쇄 미리보기가 자동으로 나타나고 미리보기에서 인쇄 버전에 display : none이 있어야하는 특정 요소가 표시됩니다. "인쇄"를 클릭하면 미리보기처럼 인쇄가 엉망이됩니다. 인쇄를 취소하면 화면의 페이지가 여전히 인쇄하기 쉬운 모드이지만 모든 것이 좋으며 없어서는 안되는 것이 없습니다. 그런 다음 마우스 오른쪽 버튼을 클릭하고 "인쇄 ..."를 선택하면 미리보기가 표시되고 모든 것이 제대로 인쇄됩니다.인쇄용 버전이 작동하지 않습니다.

이것은 Chrome에서만 발생하며 FF가 아니기 때문에 브라우저의 문제입니다.

이

는 버튼을 클릭 할 때마다 호출되는 함수입니다 :

$('#printOnlyBtn').click(function(){ 
    if ($('#mainStylesheetLink').attr('href') == 'normal.css' { 
     //switch to print-friendly css file and print 
     doPrint(); 
    } 
    else { 
     //switch back to normal css file 
     $('#mainStylesheetLink').attr('href', 'normal.css'); 
    } 
}); 

function doPrint(){ 
    $('#mainStylesheetLink').attr('href', 'printFriendly.css'); 
     window.print(); 
    }

하나의 솔루션은) (window.print에 대한 호출을 걸릴 것입니다; 하나의 단추로 인쇄용 모드로 페이지를 놓은 다음 사용자가 실제 페이지를 인쇄하기 위해 클릭해야하는 다른 단추를 갖기 만하면됩니다. 그러나 가능한 한 원 클릭 프로세스를 유지하는 것이 좋습니다.

출처

2017-03-06 Cmaso

CSS 파일에 링크하는 방법을 포기하는 것이 좋습니다. 대신 CSS에 @media print { ... } 선언을 사용해보세요. 이 블록 내에 인쇄 관련 스타일을 포함하십시오. https://developer.mozilla.org/en-US/docs/Web/CSS/@media에 멋진 문서가 있습니다.

출처

2017-03-06 21:25:13

감사합니다 - 나는하며,이 위기의 비트에있어 CSS를 다시 작성할 시간은별로 없지만 확실히 살펴 보겠습니다. – Cmaso

나는 setTimeout()을 사용하여 문제를 해결했다. 나는 경쟁 조건 또는 그런 일이있다 생각, 그래서 난 그냥 100 MS에 의해() window.print에 대한 호출을 지연 : 내가 실제로 그 전에 시도

function doPrint(){ 
    $('##mainStylesheetLink').attr('href', '#printFriendly.css'); 
    setTimeout(window.print, 100); 
}

,하지만 난 잊고, 아래를 코딩 그 코드가 지연 후 실행되도록하는 것은 다른 사람이 즉시 호출되는, 괄호없이 콜백 함수로의 setTimeout()에 전달 될 필요가 : 제안에 대한

setTimeout(window.print(), 100);

출처

2017-03-06 22:08:41 Cmaso

인쇄용 버전이 작동하지 않습니다.

답변

관련 문제