-1

ボタンを作成する必要があります。ユーザーが上記のボタンをクリックすると、アップロードするファイルを選択するように求められます。JavascriptまたはJQueryを使用してファイルを選択した後、ファイルをアップロードできるようにフォームに入力して送信する必要があります。

問題は、通常のhtmlを使用できないことです。

<input type="file" name="xml" class="custom-upload" id="custom-upload"/>

とにかくこれを行う方法はありますか？私は徹底的に検索しましたが、考えられるすべての答えは非常に複雑に見えるので、もっと本質的な解決策が欠けていると思いました。

4

1 に答える 1

1

代わりに、ボタンの画像を表示する画像を作成できます。次に、そのボタンをクリックすると、実際のファイル入力のクリックイベントをトリガーできます。

<img id="imageButton" src="soure/to/imagebutton.jpg" />
<input type="file" id="fileImageButton" style="display: none; " />

そして、トリックを行うための小さなjQuery

$("#imageButton").on('click', function() {
    $("#fileImageButton").trigger('click');
});

または、バニラJavaScript

document.getElementById('imageButton').addEventListener('click', function() {
  fileinput = document.getElementById('fileImageButton');

  if (document.createEvent) {
    var evt = document.createEvent("MouseEvents")
    evt.initMouseEvent("click", true, true, window,0, 0, 0, 0, 0, false, false, false, false, 0, null);
    fileinput.dispatchEvent(evt);
  } else {
    element.fireEvent("onclick"); //For IE
  }
});
于 2013-02-27T17:12:03.043 に答える