Wie benutze ich einen Link anstelle der Schaltfläche Durchsuchen, um eine Datei anzuhängen?

Question

Ich habe eine Form wie Folgendes:

<form id="submit_idea" name="submit_idea" method="post" action="">
  <a class="attach" title="Attach a file" onclick="clickAttachment()"
     href="javascript:void(0)">Attach File</a>
  <span id="id_filename"/>
  <input id="id_attachment" type="file" name="attachment"/>
  <input class="submit_btn" type="image" alt="Submit Idea" src="/static/img/submit_idea.png"/>
</form>

Und das damit verbundene JavaScript, das damit einhergeht.

function updateAttachment() {
    var val = $("#id_attachment").attr("value");
    if (val) {
        var name = val.split('\\');
        $("#id_filename").html(name[name.length - 1]);
    }
    else {
        setTimeout(updateAttachment, 500);
    }
}

function clickAttachment() {
    jQuery('#id_attachment').click();
    setTimeout(updateAttachment, 500);
}

Dies funktioniert hervorragend für IE, funktioniert aber überhaupt nicht für Firefox 3.5.1. Gibt es eine andere Möglichkeit, das gleiche Ergebnis in FF 3.5.1 oder höher zu erzielen, wenn Sie nur DHTML/JavaScript (kein Blitz usw.) verwenden?

Wir können CSS verwenden, um den Link "Datei anhängen" zu verkleiden, aber wir können das Layout der Browse -Taste nicht ändern. Mit der IE -Lösung können wir über einen Proxy auf die Schaltfläche klicken, um nach einer Datei zu durchsuchen, aber das funktioniert nicht unter Firefox.

Vielen Dank im Voraus, -Peter

Answer 1

Hier ist, wonach Sie suchen, glaube ich

Styling eines Eingabe type = "Datei"