Ich habe ein Skript, das getaucht wird als:

HTML:

<div id="wrapper">
     <div id="container">
        <div id="button">Click me!</div>
        <form>
            <input type="file" />
        </form>
      </div>
     <div id="notice">File is uploaded!</div>
</div>

JavaScript (JQuery 2):

$(document).ready(function () {
    $("input").on("change", function () {
       $("div#notice").fadeIn();
        //$("form").submit(); //If you want it to submit on your site uncomment this
    });
 });

CSS:

div#wrapper {
    background-color: #ccc;
    position: absolute;
    width: 300px;
    height: 200px;
}
div#wrapper > form > input {
    color: rgba(0, 0, 0, 0);
    zoom: 1;
    filter: alpha(opacity=0);
    opacity: 0;
    color: rgba(0, 0, 0, 0);
 }
div#container {
    width: 200px;
    height: 20px;
    overflow: hidden;
}
div#button, input {
    position: absolute;
    top: 0px;
    left: 0px;
    cursor: pointer;
 }
div#button {
    z-index: 1;
    background-color: #AAA;
 }
input {
    z-index: 2;
    background-color: rgba(0, 0, 0, 0);
    opacity: 0;
    alpha: filter(opacity=0);
    font-size: 25px;
    color: rgba(0,0,0,0);
    filter: alpha(opacity=0);
    zoom: 1;
 }
div#notice
{
    background-color: green;
    display: none;
    position: absolute;
    bottom: 0px;
    left: 0px;
 }

Hinweis: Dieses Problem trat auf, bevor das blinkende Symbol im Internet Explorer ausgeblendet wurde.

In Chrome und Firefox erfordert die Schaltfläche nur einen einzigen Klick. In IE 10 ist ein Doppelklick erforderlich, den ich nicht möchte. Ich versuche, einen Weg zu finden, um es mit einem Klick zu machen.

Das einzige, was ich bisher versucht habe, ist zu.render("click") am eingang, aber das hat nicht funktioniert.

JSFiddle:http://jsfiddle.net/plowdawg/mk77W/