jquery: feuern, klicken Sie auf() auf input: - Datei?

Ich versuche momentan zu restyle (eclipse) ein fileupload-element auf meiner website mit dieser Referenz. Alles gut und das Ergebnis ist vielversprechend, wenn ich den fileupload-element unter meinem neuen, alternativen Bild (so wies auf dem oben genannten tutorial). Ich will jetzt legen Sie die fileinput-element woanders und binden Sie eine Klick-Funktion auf das Bild, um eine klicken Sie auf die fileinput-element Feuer eine Datei-browser-dialog.

Ach die üblichen $('input:file').click() oder $('input:file').trigger('click') funktioniert nicht.

Ich bin auch daran interessiert, andere Wege, um das Feuer ein Datei-Dialogfeld, ohne eine Datei-upload-element (es ist nur für die javascript-Verarbeitung, kein upload auf den server).

Oh, es braucht nicht zu arbeiten, auf jeder beliebigen version von IE.

  • Sollte man das nicht $('input:file').click()? (Apostroph nach Datei)
  • mögliche Duplikate von Jquery trigger-input-Datei
  • yep verpasst, dass man.
InformationsquelleAutor dr jerry | 2011-06-15
  1. 5

    Fehlt ein Zitat der beiden code-Beispiele, versuchen $('input:file').trigger('click')
    Allerdings, soweit ich weiß, es ist nicht möglich, dies zu tun, zumindest auf diese Weise. Es ist by design so, auf den Zweck, für Sicherheitsfragen.

    Können Sie versuchen, es zu tun-tracking wird die Bewegung der Maus und verschieben der versteckten Datei-Eingang auf der Oberseite des neuen image oder was auch immer Sie verwenden, um Stil Eingang.

    • hmm, habe ich nicht bemerkt, dass. Scharf! +1
    InformationsquelleAutor Shef
  2. 3

    Wie tun Sie es jetzt, können Sie uns etwas mehr code? Auch versuchen Sie, eine eindeutige ID für die Datei-Eingabe und das Feld, das Sie auslösen möchten. Zum Beispiel:

    <span id="browse">Click here to choose a file</span>
<input type="file" id="file" />

    Versuchen Sie dabei:

    $('#browse').bind('click', function(e) {
  $('#file').click();
});
    • dieser arbeitete für mich, auch wenn die Datei versteckt war.
    • aber wenn Sie versuchen, kopieren Sie die fileupload-Pfad zum Textfeld mithilfe change Ereignis, es funktioniert nicht im IE 8,9,10.
    • id ist keine Voraussetzung, jeder Selektor übereinstimmenden die Eingabe funktionieren würde
    • das würde sicherlich große Arbeit mit multiple-input-Felder auf Ihrer Seite.
    InformationsquelleAutor Joshua - Pendo
  3. 0
    <div class="imageUploadInput">
    <img id="uploadImage" src="images/camera_icon.png" />
    <input type="file" name="thumb" id="uploadImageInput" />
</div>

    jQuery:

    $('#uploadImage').livequery("click",function(){
    $('#uploadImageInput').trigger('click');
});

    oder

    $('#uploadImage').click(function(){
   $('#uploadImageInput').trigger('click');
});
    InformationsquelleAutor Shamim
Schreibe einen Kommentar