0

カスタム スタイルで FORM ファイル入力ボタンを作成しようとしています。

以下はコードですが、うまくいきません。

<style type="text/css">
 .pictures { width:200px; height:70px; overflow:hidden;}
    input{position:absolute; top:-100px;}
</style>


<form id="test_form" method="post">

<div class="pictures">
  <input type="file">
  <button>Upload</button>
      <label>No file selected</label>
</div>

<div class="pictures">
  <input type="file">
  <button>Upload</button>
      <label>No file selected</label>
</div>

<div class="pictures">
  <input type="file">
  <button>Upload</button>
      <label>No file selected</label>
</div>

</form>

<script>
    $(function(){
        $("button").click(function() {
        var $this = $(this),
            inputVal = $this.closest('input').val();

        $this.closest('input').click(
            function(){
                $(this).change(function(){
                    $this.closest('label').text(inputVal);
                });
            }
        );      

    })  
    });
</script>
4

1 に答える 1

0

この投稿をチェックする価値があるかもしれません:ファイルを非同期的にアップロードするにはどうすればよいですか?

「jQuery file upload」を Google で簡単に検索すると、目的を達成するために利用できるプラグインがいくつかあることがわかります。これらのプラグインのスタイルをカスタマイズして、見た目を良くすることができる可能性があります。あなたが望む方法。

私は個人的に blueimp のこれが大好きです。

于 2013-04-26T14:03:02.957 に答える