8

この投稿をフォローアップすると、別の発行者がいます-テキストリンクをクリックしたときに、入力でブラウズファイルをトリガーするにはどうすればよいですか?

基本的にフォームを非表示にしたいのですが、アップロードテキストリンクをクリックするとトリガーされます。

<a href="#" class="upload">upload</a>
<form action="upload.php" method="post" enctype="multipart/form-data" id="myForm" style="display:none;">
  <input type="file" multiple="multiple" name="file[]" />
  <input type="submit" name="upload" value="Submit"/>
</form>
<div id="output"></div>

これは私の作業中のJavascriptコードです:

$(document).ready(function(){
    $('.upload').click(function(){
        $(this).trigger($('input[type=file]'));
        return false;
    });

    $('input[type=file]').change(function() {
        $('#myForm').ajaxSubmit({
               target: '#output'
        });
    });
});
4

4 に答える 4

18

style="display:none;"使用できませんstyle="visibility:hidden;"

トリガーをクリックに変更しました：

$('.upload').click(function(){
    $('input[type=file]').click();
    return false;
});

推論:

入力フィールドは ではサーバーに送信されませんが、display:noneでは送信されますvisibility:hidden。

于 2011-08-20T15:16:04.267 に答える
3

代わりにラベルを使用しないのはなぜですか? 次に、 for 属性を使用できます。

<style type="text/css">
  #file_upload {
    visibility: hidden;
  }
</style>
<a href="#" class="upload">
  <label for="file_upload">upload</label
</a>
<form action="upload.php" method="post" enctype="multipart/form-data" id="myForm">
  <input id="file_upload" type="file" multiple="multiple" name="file[]" />
  <input type="submit" name="upload" value="Submit"/>
</form>
<div id="output"></div>
于 2015-10-08T14:22:39.110 に答える
2

ジョーの方法は正しい。ただし、このソリューションは一部のブラウザーでのみ機能します。Chrome と Firefox では動作しますが、Opera、Safari、または Android Galaxy S 組み込みブラウザー (2012 年 6 月 23 日現在の最新バージョンでテスト済み) では動作しません。これらのブラウザーは、セキュリティ上の理由から、JS を介したアップロード ボタンのトリガーを無効にする可能性があります。

最新のすべてのブラウザで機能するソリューションが見つかったら、この投稿を更新します

于 2012-06-25T21:50:16.397 に答える