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 分離レベルの詳細な説明と例

推薦する

Vue のローカルコンポーネントの紹介

Vueでは、ローカルコンポーネントを自分で定義（登録）することができます。コンポーネント名を定義する...

Alibaba Cloud Server Linux システムは Tomcat を構築して Web プロジェクトを展開します

私は全体のプロセスを 4 つのステップに分けます。 JDKをダウンロードしてインストールするTomc...

JavaScript ベースの Web 計算機の実装

この記事では、ウェブ計算機のマインスイーパゲームを実装するためのJavaScriptの具体的なコード...

3列レイアウトを実現するCSS3フレキシブルボックスフレックス

タイトルの通り、高さは既知で、左と右の列の幅は 300 ピクセル、中央は適応型です。弾性ボックス自体...

Vue+Element+Springboot画像アップロードの実装例

最近、たまたま vue+springboot のフロントエンドとバックエンドの分離プロジェクトに触れ...

MySQLスレーブライブラリの復元の実践記録

状況の説明:今日、MySQL データベースのスレーブ ノード ホストにログインしたところ、/var/...

HTML の title 属性を正しく使用するためのヒント

コンテンツを携帯電話、タブレット、支援技術のユーザーから非表示にし、キーボードのユーザーにのみ表示す...

MySQLでBLOBデータを処理する方法

具体的なコードは次のとおりです。 パッケージ epoint.mppdb_01.h3c; java.i...

MySQL ビューの原則と使用例の概要

この記事では、MySQL ビューの原理と使用法についてまとめます。ご参考までに、詳細は以下の通りです...

垂直グリッドと漸進的な行間隔の例

新しい質問急いで来て、急いで行ってください。 「垂直グリッドとプログレッシブ行間隔 (パート 1)」...

MySQLの実行原理、論理階層化、データベース処理エンジンの変更について詳しく説明します

長い間 MySQL を使ってきたので、SQL 文はすでに覚えていると思います。そこで、その実行原理を...

Mysqlトランザクション操作の失敗を解決する方法

Mysqlトランザクション操作の失敗を解決する方法トランザクションの原子性: トランザクションは、デ...

Apache の一般的な仮想ホスト設定方法の分析

1. Apacheサーバーのインストールと設定yum インストール httpd -y systemc...

リアルタイムクロックを実装するネイティブJS

ネイティブ JS で実装したリアルタイム クロック エフェクトを共有します。エフェクトは以下のとおり...

MySQL 5.7 に組み込まれているストレス テストの mysqlslap コマンドと構文の詳細な説明

序文mysqlslap は、MySQL サーバーへのクライアント負荷をシミュレートし、各ステージの時...