Analyser un fichier texte dans un tableau?

J'ai actuellement 3 fichiers; ils sont dans le même répertoire sur mon ordinateur:

project.html
javascript.js
text.txt

Code de 'project.html'

<html>
<head>
    <link href="style.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="javascript.js">
    </script>
    <script
        //calling the Google Maps API
    </script>

    <script>
        //code to initialize Google Maps
    </script>
</head>

<body>
    <div class="content">
        <div id="googleMap"></div>
        <div id="right_pane_results">hi</div>
        <div id="bottom_pane_options">
            <button onclick="get_parameters()">Try It</button>
        </div>
    </div>
</body>
</html>

Code de 'javascript.js'

function get_parameters() {
    alert('hi');
    var xhr = new XMLHttpRequest();

    xhr.addEventListener('readystatechange', (output) => {
      if (xhr.readyState === 4) {
        var response = xhr.responseText;
        callback(response);
      }
    });

    xhr.open('GET', 'text.txt', true);
    xhr.send();
}

Texte en "text.txt'

Fer
Aluminium
Acier

etc... (de près de 150 lignes)

À la fin de tout, je voudrais analyser 'text.txt" dans un tableau et utiliser ce tableau pour créer une option de menu à l'ensemble du contenu. J'ai posté une question demandant si je peux analyser le fichier à l'aide de JavaScript et la réponse a été négative en raison de problèmes de sécurité. Le code JavaScript est ce que j'ai essayé, mais n'a pas fonctionné. Cela dit, est-il une autre langue que je peux utiliser pour lire le fichier et créer l'option de menu?

J'pourraient avoir quelque chose comme ceci (ci-dessous) dans le project.html fichier:

<select>
    <option value="1">Line 1 of File</option>
    <option value="2">Line 2 of File</option>
    <option value="3">Line 3 of File</option>
        <!-- etc... -->
</select>

Certaines choses à garder à l'esprit:

Tous les fichiers sont pas sur un serveur, mais sont plutôt de courir à partir de mon ordinateur (donc je suppose serveur-taille langues comme PHP ne sont pas une option)
Je voudrais créer automatiquement une option de menu en fonction du contenu de 'text.txt'
Les fichiers sont dans le même répertoire
Je ne voudrais pas que l'utilisateur soit en mesure de choisir le fichier à lire. 'text.txt' est un fichier qui est fabriqué à partir et rempli par un autre programme que j'ai fait et est susceptible de changer; c'est pourquoi je veux lire le fichier à chaque fois que le chargement de la page.

Pour info, si votre page est en cours d'exécution en vertu de l' file:// protocole plutôt que de http://, votre requête AJAX peut très bien ne pas travailler en raison de javascript sécurité bac à sable. Si vous n'avez pas de serveur, essayez de MAMP ou WAMP (gratuit je crois) pour mettre en place un site web local de la pile.
quelles erreurs avez-vous?
On ne sait pas ce que vous demandez. Voulez-vous aider avec le fractionnement de la réponse dans un tableau?
Même si vos fichiers sont seulement en cours d'exécution sur votre ordinateur, vous pouvez encore l'installation de XAMPP ou WAMPP ou que ce soit localement pour être en mesure d'utiliser PHP.
Est ce difficile à faire? Ce projet est dû dans 5 jours alors je veux être en utilisant des choses qui ne prendra pas trop de temps.

OriginalL'auteur user3015565 | 2014-01-12

Si vous pouvez modifier les paramètres du navigateur, il n'ya aucune raison pourquoi vous ne pouvez pas le faire avec javascript. Ci-dessous un exemple d'utilisation de jQuery, vous pouvez le convertir en format Javascript mais qui prendrait beaucoup plus de code.

$(document).ready(function() {
    //fetch text file
    $.get('text.txt', function(data) {
        //split on new lines
        var lines = data.split('\n');
        //create select
        var dropdown = $('<select>');
        //iterate over lines of file and create a option element
        for(var i=0;i<lines.length;i++) {
            //create option
            var el = $('<option value="'+i+'">'+lines[i]+'</option>');
            //append option to select
            $(dropdown).append(el);
        }
        //append select to page
        $('body').append(dropdown);
    });
});

Il a bien fonctionné sur IE10 avec juste une boîte de dialogue demandant si je voulais le contenu bloqué à exécuter. D'autres navigateurs peuvent ou ne peuvent pas besoin d'autres paramètres de sécurité pour le faire fonctionner.

OriginalL'auteur Danny

0

Si vous n'avez pas de serveur web, vous ne pouvez pas faire la norme XHR demandes: demandes XHR s'agir d'exécuter des requêtes HTTP vers un serveur web, que vous n'avez pas.

De la XMLHttpRequest spécification:

certaines implémentations de protocoles de soutien en plus de HTTP et de HTTPS, mais cette fonctionnalité n'est pas couvert par cette spécification

Donc certains navigateurs prend en charge la file protocole en convertissant automatiquement les demandes XHR à la "normale" chargement du fichier, mais ce que vous devez faire pour faire fonctionner peut varier d'un navigateur à l'autre et je vous décourager de suivre ce chemin.

La meilleure solution est d'utiliser un serveur web léger et le distribuer avec votre application.

Une fois que vous pouvez faire des requêtes AJAX sur votre serveur web pour récupérer le contenu du fichier et obtenir la matrice de lignes à l'aide de split.
Je suis en supposant que vous savez comment parcourir le tableau et modifier le DOM en conséquence.

Vous avez mentionné être pressé pour ce projet. Probablement que vous pourriez inclure jQuery dans votre application pour rendre votre vie plus facile.

J'ai juste remarqué à quel âge la question est de. 🙂 J'espère que ça peut aider quelqu'un d'autre..

OriginalL'auteur Domenico De Felice

ou à la vanille:

function get_parameters() {
alert('hi');
var xhr = new XMLHttpRequest();

xhr.addEventListener('readystatechange', (output) => {
  if (xhr.readyState === 4) {
    var response = xhr.responseText;
    var lines = response.split('\n');
    var i = 0;
    var select = document.createElement('select');
    do
    {
      var option = document.createElement('option');
      option.value = i;
      option.text = lines[i];
      select.appendChild(option);
      i++;
    }while(i<lines.length);
    document.body.appendChild(select);
  }
});

xhr.open('GET', 'text.txt', true);
xhr.send();
}

OriginalL'auteur Kilian Hertel

Vous devez vous connecter pour publier un commentaire.