2017-08-28 12 views
1

NW.JSでファイルダイアログを開くボタンとして画像を使用したいのですが、どうすればいいですか?NW.JSのボタンをクリックしてファイルダイアログを起動するにはどうすればよいですか?

私はこの HTML

<button id="open" style="background: none;"><img src="images/open.png" style="width:20px;background:none;"></button></div> 
<input style="display:none;" id="fileDialog" type="file" /> 

そしてこのJSを持って

function chooseFile(name, handleFile) { 
    const chooser = document.querySelector(name); 
    chooser.onchange = function() { 
     for (const f of this.files) { 
      console.log(f.name); 
      console.log(f.path); 
      handleFile(f.name, f.path); 
     } 
    }; 
    chooser.click(); 
} 
chooseFile('#fileDialog', function(name, path){ ... /* do something with the file(s) */ }); 
+0

代わりに「カスタムファイル入力」アプローチを使用することができます。https://stackoverflow.com/questions/5813344/how-to-customize-input-type-file – yuriy636

+0

これは役に立つかもしれません:https://www.npmjs。 com/package/nw-dialogを開きます。これは、ファイルダイアログのnw apiのようなものです。 – sandcastles

答えて

0
ここ

作業例完了です。

<script> 
openbtn.addEventListener('click', e => opendlg.click()); 

opendlg.addEventListener('change', e => { 
    let files = e.target.value; 
    if (files) { 
     e.target.value = ''; // or you will not receive change-event next time on the same files 
     files.split(';').forEach(filepath => { 
      alert(filepath); 
     }); 
    } 

}); 
</script> 
関連する問題