トリガーメソッドを使用して、ファイルタイプの入力をクリックせずにポップアップファイル選択ダイアログボックスを実現します。

トリガーメソッドを使用して、ファイルタイプの入力をクリックせずにポップアップファイル選択ダイアログボックスを実現します。
トリガー メソッドを使用できます。JavaScript にはネイティブのトリガー関数はありません。自分で作成するか、jQuery の実装を直接使用できます。

コードをコピー
コードは次のとおりです。

var button1 = document.getElementById("button1");
var button2 = document.getElementById("button2");
button1.onclick = function(){alert("button1");trigger(button2,"onclick");}
button2.onclick = function(){alert("button2");}
関数トリガ(要素、イベント)
{ele[イベント]();}

もっと簡単な方法として、クリックする画像、ハイパーリンク、その他の div を入力で覆い、入力を完全に透明に設定して、画像をクリックすると実際に入力をクリックするようにすることもできます。

コードをコピー
コードは次のとおりです。

<div class="ps-image" style="width:300px;height:300px;border:0px sold red; background:url('/images/ps.png')">
<input type="file" id="file" style="filter:alpha(opacity=0);opacity:0;width:100%;height:100%;"/>
</div>

<<:  CCS におけるマージン: トップ崩壊問題を解決する

>>:  Centos8 に nginx1.9.1 をインストールする詳細な手順

推薦する

dockerでrabbitmqをインストールすると管理ページに入れなくなる問題

1. 環境整備Tencent Cloud Server CENTOS 7 バージョンDockerコン...

Ubuntu 20.04 に Python 3 仮想環境をインストールする詳細なチュートリアル

以下はすべて仮想マシン上で実行されます1. pip3をインストールするsudo apt で pyth...

Linux コマンドラインでパケットをキャプチャするために tcpdump を使用するいくつかの機能

tcpdump は、ネットワークの問題のトラブルシューティングに効果的に役立つ、柔軟で強力なパケット...

MySQL 8.0 アトミック DDL 構文の詳細な説明

目次01 アトミックDDLの紹介02 一部のDDL操作の実行動作の変更03 DDL 操作のログを表示...

JS配列の次元削減のいくつかの方法の詳細な説明

2次元配列の次元削減配列インスタンスメソッド concat と ES6 スプレッド演算子を使用した次...

MySQLのよくある間違い

NULL 値によると、MySQL の NULL 値は単にデータがないことを意味します。NULL 値は...

Innodb で MySQL の 2T テーブルをすばやく削除する方法の例

序文この記事は主に、MySQL の Innodb で 2T の大きなテーブルをすばやく削除する方法に...

Element における複数データ読み込み最適化の実装

目次シナリオコードの実装要約:シナリオ最近、ElementUI をベースにしたバックグラウンド管理シ...

Linux での tcpdump コマンド例の詳細な説明

序文簡単に言えば、tcpdump は、ネットワーク上のトラフィックをダンプし、ユーザーの定義に従って...

echarts ワードクラウドチャートを使用した Vue の実践記録

echartsワードクラウドはechartsの拡張版ですhttps://echarts.apache...

Linux でファイルの権限 (所有権) を変更する

Linux と Unix はマルチユーザー オペレーティング システムであるため、ファイルの権限と所...

MySQL5.7 mysqldump バックアップとリカバリの実装

MySQL バックアップコールドバックアップ:停止服務進行備份，即停止數據庫的寫入ホットバックアップ...

MySQLの共通関数の概要

序文： MySQL データベースは、よく使用される集計関数、日付および文字列処理関数など、幅広い関数...

JavaScript 関数のコンテキストのルールは何ですか?

目次1. ルール 1: Object.Method() 1.1 ケース1 1.2 ケース2 1.3 ...

Win10にmysql8.0.15 winx64をインストールしてサーバーに接続する際に問題が発生しました

1. mysql-8.0.15をダウンロード、インストール、設定する1. 公式サイト (https:...