2

私が読んだことによると、<input type="file">JavaScript を使用してファイル参照ダイアログを開くと、一部のブラウザーで問題が発生します。これに関して、Firefox と Opera が最も問題を抱えているようです。私が見た典型的な推奨事項は<input type="file">、クリック要素の上に配置し、不透明度を 0 に設定することです。明らかに、これは理想的なソリューションではありません。

私は以下のコードを持っています:

<div style="position: absolute; overflow: hidden; width: 1px; height: 1px; opacity: 0;">
    <input type="file" id="fileInput" name="files[]" multiple="multiple" />
</div>
<input type="button" value="Open" onclick="$('#fileInput').trigger('click')" />

これを IE8、Chrome (新しいバージョン)、および Firefox (新しいバージョン) でテストしました。これらすべてで、このコードは正常に機能します。

このコードがどのブラウザで問題を起こすか知っている人はいますか? IE8+ と、Chrome、Firefox、Opera の比較的新しいバージョンをすべてサポートしたいと考えています。

4

3 に答える 3

3

次の手順に従って、互換性を確保することができます。

  1. html ファイルと jQuery (この場合は圧縮された製品版の jQuery 1.10.2) をリモート サーバーにアップロードします。

  2. このオンライン サービスを使用して、さまざまなバージョンのブラウザーをエミュレートします。

結果

  • IE 6、7、および 8: OK
  • ファイアフォックス 3、3.6: 失敗しました
  • FIREFOX 4 以降: OK
  • SAFARI4以降：OK
  • Chrome 14 以降: OK
  • OPERA 11 および 11.5: 失敗しました
  • OPERA 11.6以降：OK
于 2013-08-03T10:01:26.483 に答える
0

<------ 編集: この方法は機能しませんが、他の人が機能すると思われる場合に備えて、ここに残しておくと思います ------->

setTimeout を使用して、ファイル ブラウザーがフォールバックとして開かれたかどうかを検出できます。開いていない場合は、実際のファイル入力を表示します。

50 ミリ秒の setTimeout を追加してから、タイムアウトの実行に実際にアクセスするのにかかった時間を確認するとします。これが 100 ミリ秒未満の場合、ファイル ブラウザは開かず、javascript をブロックしていません。それよりも長く実行されている場合は、開いている必要があります。

于 2014-07-28T07:10:00.883 に答える
0

chrome 28 と Firefox 22 でコードを確認したところ、問題なく動作しました。

ただし、IE 8では確認できませんでした（ブラウザに問題がある可能性があります）。

この方法に代わる方法があります。入力を好きな場所に配置して、css 表示プロパティを none に設定するだけです。

 <input type="file" id="fileInput" name="files[]" multiple="multiple" style="display: none;" />

これを試しましたか？

于 2013-08-03T08:36:32.050 に答える