2012-03-02 14 views
8

Tôi có một số iframe trong trang của mình. Nếu iframe không tải, muốn nó alert thông báo "pdf không tìm thấy" và nếu iframe không tải, cần alert "pdf đã mở".Bạn muốn gọi một hàm nếu iframe không tải hoặc tải?

Có ai biết cách đạt được điều đó không?

+0

Bạn đang tải tệp PDF vào iframe? –

+0

@ ŠimeVidas yes. tôi muốn như thế này nếu pdf không thể được tải từ máy chủ một hộp thông báo "cảnh báo" nên đến –

+0

Có phải PDF trên cùng một tên miền với trang web không? –

Trả lời

9

Vì vậy, ý tưởng là sử dụng một yêu cầu Ajax để "kiểm tra" URL. Các yêu cầu Ajax cho phép bạn kết nối các trình xử lý "thành công" và "lỗi" - không giống như các phần tử chỉ cung cấp trình xử lý "tải".

Tất nhiên, yêu cầu Ajax bị hạn chế bởi Chính sách xuất xứ giống nhau (trừ khi máy chủ web bật CORS), nhưng bạn đã nói rằng PDF nằm trên cùng một miền, do đó không có bất kỳ vấn đề nào. Ngoài ra, bạn đã nói rằng bạn sử dụng thư viện Mootools - tôi sử dụng jQuery, vì vậy tôi chỉ có thể cung cấp cho bạn giải pháp jQuery, nhưng vì chúng tôi đang thực hiện một yêu cầu Ajax đơn giản với trình xử lý "thành công" và "lỗi" , bạn sẽ có thể tạo lại một giải pháp Mootools dựa trên giải pháp jQuery của tôi một cách dễ dàng.

Vì vậy, với một khung nội tuyến và URL:

var iframe = $('#iframe')[0]; // reference to IFRAME element 
var url = 'files/document1.pdf'; 

Các Ajax yêu cầu:

$.get(url, function() { 
    iframe.onload = function() { alert('PDF opened!'); }; 
    iframe.src = url; 
}).error(function() { alert('PDF not found'); }); 

Success-demo:http://jsfiddle.net/CZWdL/1/show/
Lỗi-demo:http://jsfiddle.net/CZWdL/2/show/

Vì vậy, nếu t yêu cầu Ajax của anh ta kích hoạt sự kiện "lỗi", chúng tôi chỉ cần cảnh báo ngay lập tức thông báo "Không tìm thấy". Tuy nhiên, nếu yêu cầu Ajax kích hoạt sự kiện "thành công", chúng tôi chỉ định trình xử lý "tải" cho phần tử IFRAME của chúng tôi (trình xử lý "tải" này cuối cùng sẽ cảnh báo thông báo "Đã tải") và đặt URL thành thuộc tính src của nó bằng tay.

+1

Cái này cũng không hoạt động. Cuộc gọi lại lỗi JQuery phát hiện mã trạng thái. Có những trường hợp máy chủ trả về trạng thái 200 cùng với các tùy chọn x-frame: SAMEORIGIN. google.com thực hiện việc này. –

+0

Tôi có nghĩa là nó sẽ không hoạt động bình thường. Nhưng đối với trường hợp của OP, tức là tải pdf trong khung nội tuyến, nó sẽ hoạt động. –

+0

Chờ, cả JQuery và iFrame đều đang tìm nạp URL? Không phải là một chút nặng nề? –

-2

Bạn chỉ có thể thêm mã này trong iframe của bạn khi nó được nạp:

<script type="text/javascript"> 
<!-- 
     window.top.window.callback(); 
//--> 
</script> 

Và trong trang hàng đầu của bạn:

<script type="text/javascript"> 
<!-- 
     function callback() { 
       alert("File loaded!"); 
     } 
//--> 
</script> 

Nếu hàm callback của bạn không được gọi sau 30 giây, bạn có thể nói rằng pdf của bạn không được tải.


Edit: tập tin của bạn đầu tiên (với iframe):

<html> 
    <head> 
     <script type="text/javascript"> 
     <!-- 
      function callback() { 
       alert("This file doesn't exist"); 
      } 
     //--> 
     </script> 
    </head> 
    <body> 
     <iframe src="load_pdf.php?f=test.pdf" style="width:900px;height:500px;"></iframe> 
    </body> 
</html> 

Thứ hai (php tập tin):

<?php 
$file = $_GET['f']; 

if(is_file($file)) { 
    header('Content-type: application/pdf'); 
    readfile($file); 
} 
else { 
    // This file doesn't exist 
    echo ' 
     <script type="text/javascript"> 
     <!-- 
       window.top.window.callback(); 
     //--> 
     </script> 
    '; 
} 
?> 

Đừng quên để bảo đảm $ _GET [ 'f']

+0

Bạn có thể tải lên một số ví dụ trong fiddle –

+1

Tôi không nghĩ rằng giải pháp này sẽ hoạt động cho trường hợp cụ thể này vì trang bên trong khung nội tuyến không phải là HTML, đó là tài liệu PDF. – Fenton

Các vấn đề liên quan