Select はダブルクリック dbclick イベントをサポートしていません

Select はダブルクリック dbclick イベントをサポートしていません
XML/HTML コードコンテンツをクリップボードにコピー
  1. < div  クラス= "centent"  スタイル= "幅:200px; フロート:左; マージン右:20px;" >     
  2. <選択  multiple = 「複数」   id = "選択1"  スタイル= "幅:150px; 高さ:160px;" >     
  3. <オプション = "1" >オプション 1 </オプション>     
  4. <オプション  value = "2" >オプション 2 </オプション>     
  5. <オプション  value = "3" >オプション 3 </ option >     
  6. <オプション = "4" >オプション 4 </オプション>     
  7. <オプション = "5" >オプション 5 </オプション>     
  8. </選択>     
  9.   
  10. <div>     
  11. <スパン  id = "追加"   style = "display:block; width:140px; cursor:pointer;" >選択して右側に追加> > </ span >     
  12. <スパン  id = "すべて追加"   style = "display:block; width:140px; cursor:pointer;" >すべてを右側に追加> > </ span >     
  13. </div> </div>     
  14. < div  クラス= "centent"  スタイル= "幅:200px; フロート:左; マージン右:20px;" >     
  15. <選択  multiple = 「複数」   id = "select2"  スタイル= "幅:150px; 高さ:160px;" >     
  16. </選択>     
  17. <div>     
  18. <スパン  id = "追加1"   style = "display:block; width:140px; cursor:pointer;" > < <左を選択して削除</ span >     
  19. <スパン  id = "addAll1"   style = "display:block; width:170px; cursor:pointer;" > < <すべて選択して左側を削除します</ span >     
  20. </div>     
  21. </div>   
JavaScriptコードコンテンツをクリップボードにコピー
  1. <スクリプトタイプ= "text/javascript" >
  2.   
  3. //ドロップダウンボックスでの複数選択の適用 9:57   
  4. $(関数() {
  5. //左から右への追加を開始する  
  6. $( "#add" ).click( function (){ //選択した項目を右側に追加します  
  7. $option = $( "#select1 オプション:選択済み" );
  8. $option.appendTo( "#select2" );
  9. })
  10. $( "#addAll" ).click( function (){ //すべてを右側に追加  
  11. $option = $( "#select1 オプション" );
  12. $option.appendTo( "#select2" );
  13. })
  14. $( "#select1" ).dbclick( function (){ //ダブルクリックして右側に追加します  
  15. $option = $( "#select1 オプション:選択済み" this );
  16. $option.appendTo( "#select2" );
  17. })
  18. //右側を左側に追加し始める  
  19. $( "#add1" ).click( function (){ //選択した項目を左に追加する  
  20. $option = $( "#select2 オプション:選択済み" );
  21. $option.appendTo( "#select1" );
  22. })
  23. $( "#addAll1" ).click( function (){ //すべてを左に追加  
  24. $option = $( "#select2 オプション" );
  25. $option.appendTo( "#select1" );
  26. })
  27. $( "#select2" ).dbclick( function (){ //ダブルクリックして左に追加  
  28. $option = $( "option:selected" , this );
  29. $option.appendTo( "#select1" );
  30. })
  31. })
  32. </スクリプト>

<<:  JavaScript関数の使い方の詳細な説明

>>:  MySQL 分離レベルの詳細な説明と例

推薦する

JavaScript でのカスタム スワイパー コンポーネントの詳細な説明

目次エフェクト表示コンポーネント設定ステップ1ステップ2ステップ3コンポーネントの使用ステップ1ステ...

LinuxにMySQLデータベース5.6のソースコードをインストールし、ログインユーザーのパスワードを変更する

この記事では、主に Linux で MYSQL データベースをインストールする方法について説明し、M...

JavaScriptの基礎を学ぶ

目次1. JavaScriptを記述する場所2. JavaScriptでよく使われる入力文と出力文1...

ウェブサイトのビジュアルデザイン(画像とテキスト)における情報伝達の役割と方法

現代の Web ビジュアル デザインは、初期の情報の積み重ねから、その後のグラフィックスと抽象化、そ...

ウェブページを作るときに注意すべき5つのポイント

1. 色合わせの問題<br />Web ページには 3 色以上使用しないでください。そう...

htm 初心者ノート(初心者は必ず読んでください)

1. HTMLとは何かHTML (ハイパーテキスト マークアップ言語): ハイパーテキスト マーク...

React Hooksの使用例

目次簡単なコンポーネントの例より複雑な親子コンポーネントのケースオンセレクトの書き方反応する子供Re...

nginx プロキシ サーバーで双方向証明書検証を構成する方法

証明書チェーンを生成するスクリプトを使用して、ルート証明書、中間証明書、および 3 つのクライアント...

シンプルな CSS テキストアニメーション効果

成果を達成する 実装コードhtml <div id=コンテナ> いらっしゃいませ <...

VirtualBox でのホストオンリー + NAT モードのネットワーク構成

VirtualBoxのHost Only+NATモードのネットワーク構成は参考用です。具体的な内容は...

LDAP ユーザー認証を使用するように Linux を構成する方法

私は CentOS に実装された LDAP ユーザー管理を使用しています。これはインターネット上のほ...

HTMLを教える記事

アーティストになるつもりがない場合は、開発者として HTML を読んで、必要に応じて簡単な変更を加え...

vue3 のさまざまなファイルタイプのプレビュー機能の例

目次序文1. オフィス文書の種類のプレビュー2. PDF形式のプレビュー3. 画像の種類4. ビデオ...

Ubuntu 18.04 のログインループ/ブートインターフェイスで停止/グラフィカルインターフェイスに入ることができない問題を解決する方法

原因: NVIDIA グラフィック カード ドライバーが破損している解決:コマンドラインモードで再起...

MySQLの7種類のログの概要

MySQL には次のログ ファイルがあります。 1: 再実行ログ2: ロールバックログ(元に戻すログ...