Hoe een waarde instellen op een bestandsinvoer in HTML?

Hoe kan ik de waarde hiervan instellen?

<input type="file" />

Antwoord 1, Autoriteit 100%

U kunt vanwege veiligheidsredenen niet.

Stel je voor:

<form name="foo" method="post" enctype="multipart/form-data">
    <input type="file" value="c:/passwords.txt">
</form>
<script>document.foo.submit();</script>

U wilt niet dat de websites die u bezoekt om dit te kunnen doen, of wel? =)

Antwoord 2, Autoriteit 25%

U kunt het niet.

De enige manier om de waarde van een bestandsinvoer in te stellen, is door de gebruiker om een ​​bestand te selecteren.

Dit gebeurt om veiligheidsredenen. Anders zou u een JavaScript kunnen maken dat automatisch een specifiek bestand uploadt van de computer van de klant.

Antwoord 3, Autoriteit 10%

Geen antwoord op uw vraag (welke anderen hebben beantwoord), maar als u een bewerkingsfunctionaliteit van een geüpload bestandsveld wilt hebben, wat u waarschijnlijk wilt doen is:

• Toon de huidige waarde van dit veld door gewoon de bestandsnaam of–URL af te drukken, een klikbare link om het te downloaden, of als het een afbeelding is: laat het gewoon zien, eventueel als miniatuur
• De <input>TAG om een ​​nieuw bestand te uploaden
• Een selectievakje die, wanneer het wordt gecontroleerd, het momenteel geüpload bestand verwijdert. Merk op dat er geen manier is om een ​​’leeg’ bestand te uploaden, dus je hebt zoiets nodig om de waarde van het veld

op te lossen

Antwoord 4, Autoriteit 6%

je kunt het niet. En het is een beveiligingsmaatregel. Stel je voor dat iemand JS schrijft die bestandsinvoerwaarde instelt op een gevoelig gegevensbestand?

Antwoord 5, Autoriteit 5%

Zoals iedereen hier heeft vermeld: u kunt niet alleen elk bestand automatisch uploaden met JavaScript.

Echter! Als u toegang hebt tot de informatie die u in uw code wilt verzenden (dwz niet C:\passwords.txt), kunt u het uploaden Als een -blob -type, en behandel het dan als een bestand.

Wat de server zal bezoeken, is niet te onderscheiden van iemand die daadwerkelijk de waarde van <input type="file" />instellen. De truc is uiteindelijk om een ​​nieuwe XMLHttpRequest()met de server …

function uploadFile (data) {
        // define data and connections
    var blob = new Blob([JSON.stringify(data)]);
    var url = URL.createObjectURL(blob);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'myForm.php', true);
        // define new form
    var formData = new FormData();
    formData.append('someUploadIdentifier', blob, 'someFileName.json');
        // action after uploading happens
    xhr.onload = function(e) {
        console.log("File uploading completed!");
    };
        // do the uploading
    console.log("File uploading started!");
    xhr.send(formData);
}
    // This data/text below is local to the JS script, so we are allowed to send it!
uploadFile({'hello!':'how are you?'});

Dus, waar zou u dit voor kunnen gebruiken? Ik gebruik het voor het uploaden van HTML5 canvaselementen als JPG’s. Dit bespaart de gebruiker de moeite om een ​​fileinput-element te openen, alleen om de lokale, in de cache afbeelding te selecteren die ze zojuist, gewijzigd, enz .. maar het zou moeten doen werk voor geen bestandstype.

Antwoord 6

Ik heb write volledig voorbeeld voor load URL als input file, en een voorbeeld

U kunt hier controleren
1
https://vulieumang.github.io/vuhocjs/file2input-input2file/

in het kort kun je deze functie gebruiken

function loadURLToInputFiled(url){
  getImgURL(url, (imgBlob)=>{
    // Load img blob to input
    // WIP: UTF8 character error
    let fileName = 'hasFilename.jpg'
    let file = new File([imgBlob], fileName,{type:"image/jpeg", lastModified:new Date().getTime()}, 'utf-8');
    let container = new DataTransfer(); 
    container.items.add(file);
    document.querySelector('#file_input').files = container.files;
  })
}
// xmlHTTP return blob respond
function getImgURL(url, callback){
  var xhr = new XMLHttpRequest();
  xhr.onload = function() {
      callback(xhr.response);
  };
  xhr.open('GET', url);
  xhr.responseType = 'blob';
  xhr.send();
}

Antwoord 7

Definieer in html:

<input type="hidden" name="image" id="image"/>

In JS:

ajax.jsonRpc("/consulta/dni", 'call', {'document_number': document_number})
    .then(function (data) {
        if (data.error){
            ...;
        }
        else {
            $('#image').val(data.image);
        }
    })

Na:

<input type="hidden" name="image" id="image" value="/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8U..."/>
<button type="submit">Submit</button>

Antwoord 8

Eigenlijk kunnen we het.
we kunnen de standaardwaarde van het bestand instellen door webbrowserbesturing in c# te gebruiken met FormToMultipartPostData Library. We moeten deze bibliotheek downloaden en in ons project opnemen. Webbrowser stelt de gebruiker in staat om webpagina’s in vorm te navigeren.
Zodra de webpagina is geladen, wordt het script in de webBrowser1_DocumentCompleted uitgevoerd.
Dus,

private void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
    {
       FormToMultipartPostData postData = 
            new FormToMultipartPostData(webBrowser1, form);
        postData.SetFile("fileField", @"C:\windows\win.ini");
        postData.Submit();
    }

Raadpleeg de onderstaande link voor downloaden en volledige referentie.

https:/ /www.codeproject.com/Articles/28917/Setting-a-file-to-upload-inside-the-WebBrowser-com