ホームページ > 記事 > ウェブフロントエンド > HTMLでフォルダーを開く方法

HTMLでフォルダーを開く方法

下次还敢オリジナル: 2024-04-22 09:44:51487ブラウズ

HTML を使用してフォルダーを開くには: HTML ドキュメントを作成し、webkitdirectory 属性を使用してフォルダー選択ダイアログを有効にします。ユーザーが複数のフォルダーを選択できるようにするには、multiple 属性を使用します。 JavaScript を使用して、選択したフォルダーにアクセスし、選択したフォルダーに対する操作を実行します。

HTMLでフォルダーを開く方法

#HTML を使用してフォルダーを開く方法

HTML を使用してフォルダーを開くには、次の手順を実行できます。 :

ステップ 1: HTML ドキュメントを作成する

新しい HTML ドキュメントを作成し、次のコードを使用します:

<code class="html"><html>
<head>
  <title>打开文件夹</title>
</head>
<body>
  <input type="file" webkitdirectory multiple>
</body>
</html></code>

ステップ 2: webkitdirectory プロパティ

webkitdirectory プロパティを使用すると、フォルダー選択ダイアログボックスが有効になります。このプロパティは、WebKit ブラウザ (Safari、Chrome など) でのみサポートされます。

ステップ 3: multiple 属性を使用する

multiple 属性を使用すると、ユーザーは複数のファイルまたはフォルダーを一度に選択できます。。

ステップ 4: JavaScript を使用して、選択したフォルダーにアクセスします。

JavaScript を使用して、選択したフォルダーにアクセスできます。次のコードは、選択したフォルダーのリストを取得する方法を示しています。

<code class="javascript">var input = document.querySelector('input[type="file"]');

input.addEventListener('change', function() {
  var folders = input.files;
  // 对选定的文件夹进行操作
});</code>

コードの説明:

input.files FileList オブジェクトが含まれています。、選択したファイルとフォルダーが含まれています。

以上がHTMLでフォルダーを開く方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

JavaScript chrome safari html webkit 对象 input

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：ローカルファイルをHTMLで開く方法次の記事：ローカルファイルをHTMLで開く方法

続きを見る