Insérer la valeur d'entrée / JavaScript

J'ai le texte suivant JS /HTML code:

<input type="text" class="file" name="file_info" id="file_info">
    <div class="file_upload">
        <input type="file" id="file_upload" onchange="name();">
    </div>
<script>
    function name() {
        var fileName = document.getElementById("file_upload").value;
        var fnSplit = fileName.split(/[\/\\]/);
        fileName = fnSplit[fnSplit.length - 1];
      document.getElementById('file_info').innerHTML = 'Fred Flinstone';
    }
</script>

Je veux qu'après que j'ai télécharger le fichier, le nom de fichier dans la tput texte, mais cette cide ne fonctionne pas.

Comment puis-je résoudre ce problème?

Mise à jour : Le nom de fichier doit être à l'intérieur de l'entrée de texte

  • Je ne pense pas que vous êtes supposé utiliser innerHTML sur des éléments d'entrée
InformationsquelleAutor Nave Tseva | 2013-07-13
  1. 2

    Déplacer votre script élément avant de le input élément. Vous feriez mieux de mettre la script élément à l'intérieur de votre head comme ce

    Démo

    La mise à jour de la réponse!

    • Éléments d'entrée n'utilisez pas innerHTML soit. Voulez probablement value.
    • Vous ne pouvez pas manipuler le fichier des entrées pour des raisons de sécurité.
    • Le nom de fichier doit être dans sepreat de saisie de texte
    • Il ne fonctionnent pas encore, le nom de fichier n'est pas dans l'entrée
    • on peut obtenir le chemin d'accès au fichier de fichier de formulaire élément object w3schools.com/jsref/dom_obj_fileupload.asp
    • désolé, merci pour votre avis, j'ai vérifié le code et il fixe.
    • Vous pouvez le vérifier maintenant, j'ai juste oublier de mettre à jour le lien, la révision en cours est de 3.

    InformationsquelleAutor Hieu Le
  2. 0

    Vous pouvez essayer ce code:

    <!DOCTYPE html>
<html>
    <head>
        <script>
            function myFunction()
            {
                var fileName =document.getElementById("file_upload").value;
                var fnSplit = fileName.split(/[\/\\]/);
                fileName = fnSplit[fnSplit.length - 1];

                document.getElementById('file_info').value = fileName
            }
        </script>
    </head>
    <body>

        <input type="text" class="file" name="file_info" id="file_info">
        <div class="file_upload">
            <input type="file" id="file_upload" onchange="myFunction();">
        </div>
    </body>
</html>
    InformationsquelleAutor amatellanes
  3. -2

    De faire comme ceci:

    HTML

    <div class="file_upload">
    <input type="file" id="file_upload">
</div>
<div id="file_info"></div>

    JS

    function name(file) {
    var reader = new FileReader();
    reader.readAsText(file);

    reader.onload = function (event) {
        document.getElementById('file_info').innerHTML = "Filename: " + file.name + "\nContent: " + event.target.result;
    };

    reader.onerror = function () {
        alert('Unable to read ' + file.name);
    };
}

document.getElementById('file_upload').onchange = function () {
    name(this.files[0]);
};

    DÉMO

    • Expliquer la baisse de vote s'il vous plaît, si c'était pour la faute de frappe, c'est corrigé.
    • Le nom de fichier doit être dans sepreat d'entrée
    InformationsquelleAutor Jonathan