Pytanie Osadź pliki tekstowe w html


Chciałbym wyświetlić zawartość pliku tekstowego na stronie HTML (.rtf, .txt, .log, ...) przechowywane na serwerze.

Próbowałem z embed ale wydaje się, że to nie działa.

<embed src="/path_to_text_file/text.rtf" width="500" height="300">

Istnieje "prosta" metoda (lub znacznik), aby to zrobić, lub powinienem zeskanować zawartość i wydrukować ją, na przykład, jQuery?


11
2017-10-11 17:48


pochodzenie


Zamiast tego użyj obiektu - Dvir
@Dvir z obiektem uruchamia automatycznie pobieranie bez pokazywania zawartości pliku - damoiser
Masz na myśli osadzanie lub włączanie? RTF lub zwykły tekst? Różne rzeczy. - Jukka K. Korpela
@ JukkaK.Korpela wyświetla zawartość pliku. Wszelkiego rodzaju "uproszczony" format tekstowy (.rtf, .txt, .log, ...) - damoiser
@CraigHicks, jeśli dobrze pamiętam, co robiłem 5 lat temu ;-) z tagiem embed zaczął pobierać plik zamiast wyświetlać treść - damoiser


Odpowiedzi:


Używając funkcji $ .ajax () z funkcją .append () wewnątrz możesz z łatwością pobrać zawartość dokumentu tekstowego i wyświetlić je na stronie. Coś na wzór tego, co widać poniżej. Wykonaj tę czynność po załadowaniu strony, aby natychmiast wczytać plik do reszty strony.

$.ajax({
        async:false,
        url: 'folder/file.txt',
        dataType: 'text',
        success: function(data) 
        {
        $('element').append(data);
            }
        });

Pobaw się trochę, aby uzyskać prawidłowy wynik, którego szukasz. Możesz również użyć PHP, ale jeśli naprawdę nie potrzebujesz parsować danych, PHP jest nieco przesadzone w tej sytuacji.


6
2017-10-11 18:33



+1 trochę zawikłany, ale działa;) - damoiser
To jest włączenie, a nie osadzanie. Może to, co było rzeczywiście potrzebne, ale nie to, o co go proszono. - Jukka K. Korpela
Ha, przepraszam damoiser, ale cieszę się, że to działa dla ciebie. Możesz również użyć żądania $ .get (), po prostu pomyślałem, że dam ci oryginalne żądanie ajax, które ma więcej opcji, którymi możesz sterować. - Keith V


Coś takiego powinno to zrobić:

<object data="/path_to_text_file/text.txt" type="text/plain"
width="500" style="height: 300px">
<a href="/path_to_text_file/text.txt">No Support?</a>
</object>

7
2017-10-11 17:55



z Chrome nie działa, wydaje się, że automatycznie uruchamia pobieranie bez pokazywania treści - damoiser
Kod wysłany działa dobrze. Podobny kod dla pliku RTF może nie być. - Jukka K. Korpela
@ JukkaK.Korpela przetestowany z plikiem .rtf - damoiser
To działa w Chrome 63. Musisz jednak poczekać na załadowanie dokumentu. Np. Z poziomu a window.onload wydarzenie, zrób data.contentDocument.body.textContent.trim(), gdzie data jest odniesieniem do twojego object element. Poza tym prawdopodobnie chcesz mieć zerową szerokość i wysokość object element (ale nie style="display:none" - to go złamie). - George


 jest tylko dla zawartości wtyczki (flash, itp.). Spróbuj uzyskać zawartość za pomocą ajax, a następnie zapisz go document.write; Lub użyj include tag w języku back-end (PHP, ASP, itp.)


3
2017-10-11 17:54



+1, aby dać mi właściwy kierunek do pracy, Keith V wygrywa najlepszą odpowiedź, ponieważ daje mi bardziej kompletne rozwiązanie niż twoje - damoiser


UWAGA: przeprosiny za podobieństwo do odpowiedzi Keitha V i fakt, że wspomniał o otrzymaniu próśb - zauważyłem tylko jego komentarz na temat otrzymywania wniosków po opublikowaniu mojej odpowiedzi.

Uważam, że poniższa struktura jest pomocna i pozwala mi na styl tekstu jako przęsła, a nie na posiadanie obiektu:

function append_url_content_to_div(url){
  $.get(url, function(returned_data){
    console.dir(returned_data);
    var content = '<span>'+returned_data+'</span>';
    $("#appendee_div").append(content);								
  });
}
append_url_content_to_div("https://dl.dropbox.com/s/euk874r7zd1cx0d/example_text.txt?dl=0"); //note that it has to be "dl." not "www." in dropbox
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="appendee_div"></div>

Działa to dla mnie w przypadku zawartości Dropbox, ale nie widzę powodu, dla którego nie działałoby to w przypadku publicznie dostępnych plików tekstowych. Jak widać w kodzie, potrzebujesz jquery.


0
2018-03-31 07:47





Uważam, że najlepszym sposobem na wstawienie kodu HTML5 na stronę jest zapisanie kodu na nowym dokumencie tekstowym i osadzenie tego dokumentu za pomocą. Następnie możesz sformatować kod za pomocą css i divs.


-3
2017-11-20 17:40



umieść ten dokument za pomocą co? - dwilliss


Po prostu użyj php. Zmień format html na php i użyj

echo file_get_contents ("name_of_the_file.txt");

Proste. Musisz używać php, ponieważ musisz wypisać tekst po stronie serwera, chyba że informacje nie będą wyświetlane klientowi.

Myślę, że jest to najłatwiejszy sposób robienia tego, co chcesz.


-4
2018-05-29 13:14



Nie sądzę, że muszę używać programowania po stronie serwera, takich jak PHP, ASP, AngularJS, .. na pewno jest łatwiejsze, ale moje pytanie było, jak wdrożyć to tylko po stronie klienta. Zobacz zaakceptowane rozwiązanie - damoiser