it-swarm.com.de

bei Änderungsereignis für Dateieingabeelement

Ich habe 4 Dateieingaben, bei denen sie den Upload-Prozess auslösen möchten, wenn sich ihr Wert ändert .. Ich meine, wenn Sie ein Bild auswählen und auf "Bild auswählen" klicken, wird das Skript zum Hochladen des Bildes ausgelöst. Ich habe das onchange-Ereignis verwendet, aber ich denke, dass dies nicht das richtige Ereignis ist:

JS:

$("input[type=file]").on('change',function(){
    alert(this.val());//I mean name of the file
});

HTML:

<div class="form-group col-md-11 col-md-offset-1">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
</div>

Was soll ich machen?

19
Ramin

Das OnChange-Ereignis ist eine gute Wahl. Wenn ein Benutzer dasselbe Bild auswählt, wird das Ereignis jedoch nicht ausgelöst, da der aktuelle Wert dem vorherigen entspricht. 

Das Bild ist beispielsweise mit einer geänderten Breite gleich und sollte auf den Server hochgeladen werden. 

Um dieses Problem zu vermeiden, können Sie den folgenden Code verwenden:

$(document).ready(function(){
    $("input[type=file]").click(function(){
        $(this).val("");
    });

    $("input[type=file]").change(function(){
        alert($(this).val());
    });
});
19

Verwenden Sie die Dateiliste files des Elements anstelle von val().

$("input[type=file]").on('change',function(){
    alert(this.files[0].name);
});
8
techfoobar

Geben Sie eine eindeutige Klasse und eine andere ID für die Dateieingabe an

           $("#tab-content").on('change',class,function()
               {
                  var id=$(this).attr('id');
                      $("#"+id).trigger(your function); 
               //for name of file input  $("#"+id).attr("name");
               });
1
AAA

Für jemanden, der das onchange-Ereignis direkt für die Dateieingabe verwenden möchte, setzen Sie onchange="somefunction(), Beispielcode aus dem Link :

<html>
<body>
    <script language="JavaScript">
    function inform(){
        document.form1.msg.value = "Filename has been changed";
    }
    </script>
    <form name="form1">
    Please choose a file.
    <input type="file" name="uploadbox" size="35" onChange='inform()'>
    <br><br>
    Message:
    <input type="text" name="msg" size="40">
    </form>
</body>
</html>
0
yu yang Jian