Asp.net C＃アップロードコントロール

Question

私は画像のアップロードコントロールを作成しましたが、私はその外観に満足していません。私は、ボタンの左側にテキストボックスではなく、表示されているボタンを必要とします。通常のボタンコントロールまたはリンクボタンコントロールを使用してファイルダイアログを開くための方法はありますか？

Answer 1

私は、Firefox 4、IE6とIE9で働いて、この単純な例だが、残念ながらそれはクローム10に

<script type="text/javascript"> 
    $(document).ready(function() { 
     var cnt = 1; // for interfering id's 
     $('#upload').click(function() { 

      // adds a new file-browser upload control and calls the AppendFilesToList with file information 
      $("#files").append("<input type=\"file\" id=\"fileupload" + cnt + "\" onchange=\"javascript:AppendFilesToList(this.value);\" style=\"display:none;\" />"); 
      document.getElementById("fileupload" + cnt).click(); // calls the browsers file-upload dialog 

      cnt++; 
     }); 
    }); 
    // appends file information to a div 
    function AppendFilesToList(evt) { $("#listfiles").append(evt + "<br/>"); } 
</script> 

<div id="files"></div> 
<div id="listfiles"></div> 

<br /> 

<input type="button" id="upload" value="Select files" /> 

動作しないあなたは、しかし、のスタイリングについてのこれらの記事をチェックアウトすることができます。http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_domhttp://www.quirksmode.org/dom/inputfile.html

Answer 2

方法は<input type="file" />は、使用しているブラウザによって異なります。それを均一にする方法については、this postをチェックしてください。しかし、実際のレンダリングを隠して、自分のものを隠しています。

Answer 3

ブラウザを非常に制限して、アップロード入力のスタイリングを制御して、ユーザーを騙すことによって引き起こされる被害を軽減します。

あなたは尋ねているのと同じようにすることができますが、各ブラウザがアップロードボタンを別の場所に配置することを考慮しなければなりません。隠された要素をここに配置することで効果的にスタイルをハッキングします。外観と機能がすべてのブラウザで一貫していない可能性があります。

This articleあなたが探している情報がいくつかあります。