質問: ``` test.txt ``` でリンクをクリックすると > > ![結果](https://teratail.storage.googleapis.com/uploads/contributed_images/d9c479bc1f0a7398376dd2763013b06e.png) > > > と表示された通り、 名前は「foo.txt」、結果は「失敗 - ファイルがありません」 でした。 この時名前を聞かれる事はありませんでした。 サーバに`test`とだけ書いた`foo.txt`を置いても同じでした。 test.txtを ``` test ``` として作成しておいたら、 内容は`test.txt`、ファイル名は`foo.txt`で保存されましたが、 やはり名前を指名する場面はなく、 自動的にダウンロードフォルダに保存されました。
回答: ダイアログからファイル名を指定するのではなく, ファイル名を指定する`input`を用意し, 保存ボタンクリック時にこの内容で`a`要素の`download`属性を書き換えます. その後,`a`要素の`click`メソッドを実行することでボタンをクリックすることで, 直接ファイル保存ダイアログを表示できます. 但しクロスブラウザでの動作に難があるため, 適宜「右クリックによる保存」テクニックも併用すると良いでしょう. ``` ``` ``` save.onclick = e => { link.download = fname.value + ".txt"; link.href = "data:text/plain,aaa"; link.click(); }; ``` 動作例