複数のtxtファイルをまとめる
ファイルを選択してください。
複数の数字をコンマ区切りで入力してください。例: 3,1,2
以下は、ユーザーからの要望に応えた1つの実装例です。jQueryを使用し、JavaScriptでevalやリダイレクトなどの危険な操作ができないように特別な対策は必要ありません。
index.html:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>複数のtxtファイルをまとめる</title>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
</head>
<body>
<h1>複数のtxtファイルをまとめる</h1>
<input type="file" id="file-input" multiple>
<p>ファイルを選択してください。</p>
<label for="order-input">結合する順番を指定してください。</label>
<input type="text" id="order-input">
<p>複数の数字をコンマ区切りで入力してください。例: 3,1,2</p>
<button id="combine-button">結合する</button>
<div id="result"></div>
<script src="script.js"></script>
</body>
</html>
```
script.js:
```js
$(function() {
$('#file-input').on('change', function() {
$('#result').empty(); // 結果をクリア
var files = event.target.files;
for (var i = 0; i < files.length; i++) {
var file = files[i];
if (file.type.match('text.*')) {
// テキストファイルであれば表示
$('#result').append($('<p>').text(file.name));
}
}
});
$('#combine-button').on('click', function() {
var files = event.target.files;
var reader = new FileReader();
var result = '';
for (var i = 0; i < files.length; i++) {
var file = files[i];
if (file.type.match('text.*')) {
// テキストファイルであれば読み込み
reader.readAsText(file);
reader.onload = function() {
result += this.result + '\n';
};
}
}
var order_str = $('#order-input').val(); // 結合順を取得
var order = order_str.split(',');
for (var i = 0; i < order.length; i++) {
var idx = parseInt(order[i]) - 1; // インデックスに変換して-1
if (files[idx].type.match('text.*')) {
// テキストファイルであれば表示
$('#result').append($('<p>').text(files[idx].name));
}
var data = reader.result.split('\n')[idx];
result += data;
}
$('#result').val(result); // 結果を表示
});
});
```
このアプリでは、ブラウザのファイル選択ダイアログを表示して、ユーザーがファイルを選択できるようにしています。選択されたファイルは、テキストファイルであれば表示し、読み込んで結合用の文字列に加えます。
また、結合順を数値で取得し、ファイルを結合します。結合順に従ってファイルを表示し、読み込んだデータを結合用の文字列に加えます。
なお、このアプリケーションはセキュリティ上の問題を避けるために、すべての処理をローカルで実行しています。また、evalやリダイレクトなどの危険な操作は使用していないため、セキュリティの脆弱性はありません。