ホームページ ウェブフロントエンド jsチュートリアル 実用的なクリック入力ボックスを実装して選択ボックスをポップアップする JS CSS メソッド_javascript スキル

実用的なクリック入力ボックスを実装して選択ボックスをポップアップする JS CSS メソッド_javascript スキル

May 16, 2016 pm 04:12 PM
css js クリック 役に立つ ポップアップ 方法 入力ボックス 選択ボックス

この記事の例では、JS CSS を使用して入力ボックスをクリックして選択ボックスをポップアップ表示する実用的な方法を実装する方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

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


<頭>
JS CSS 打造用の单击入框弹出选框効果

<スクリプト言語="javascript" タイプ="text/javascript">
関数 moveselect(obj,target,all){
 if (!all) all=0
 if (obj!="[オブジェクト]") obj=eval("document.all." obj)
 target=eval("document.all." target)
 if (all==0)
 {
   while (obj.selectedIndex>-1){
   //alert(obj.selectedIndex)
   mot=obj.options[obj.selectedIndex].text
   mov=obj.options[obj.selectedIndex].value
   obj.remove(obj.selectedIndex)
   var newoption=document.createElement("オプション");
   newoption.text=mot
   newoption.value=mov
   target.add(newoption)
   }
 }
 それ以外
 {
  //alert(obj.options.length)
  for (i=0;i    {
   mot=obj.options[i].text
   mov=obj.options[i].value
   var newoption=document.createElement("オプション");
   newoption.text=mot
   newoption.value=mov
   target.add(newoption)
   }
obj.options.length=0
 }
}
関数 dakai(){
document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block'
}
関数guanbi(){
//右边選択の值転送文本框内
varyuanGong=document.getElementById("yuanGong")
yuanGong.value=""//句如果不加这,则每次选择的結果追加
var huoQu=document.getElementById("D2")
for(var k=0;k yuanGong.value=yuanGong.value huoQu.options[k].value " "//" "中间是空格,字符分隔符,可改别的
document.getElementById('light').style.display='none';
document.getElementById('fade').style.display='none'
}






 
   
   
   


OK






この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。

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

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

写真で使用されているエンコードされたフォントは何ですか?このフォントスタイルをプロジェクトに適用する方法は? 写真で使用されているエンコードされたフォントは何ですか?このフォントスタイルをプロジェクトに適用する方法は? Apr 05, 2025 pm 05:06 PM

プログラミングとWebデザインでエンコードされたフォントの紹介と使用、右のフォントを選択すると、コードの読みやすさと美学が大幅に向上する可能性があります。最近の、...

エルテーブルのマージ行のホバー効果をカスタマイズする方法は? エルテーブルのマージ行のホバー効果をカスタマイズする方法は? Apr 05, 2025 pm 06:54 PM

エルテーブルのマージ行のホバー効果をカスタマイズする方法は?要素を使用...

Webページにローカルにインストールされている「Jingnan Mai Round Body」を正しく表示するにはどうすればよいですか? Webページにローカルにインストールされている「Jingnan Mai Round Body」を正しく表示するにはどうすればよいですか? Apr 05, 2025 pm 10:33 PM

最近、Webページにローカルにインストールされたフォントファイルを使用して、インターネットから無料のフォントをダウンロードし、システムに正常にインストールしました。今...

CSSのShape-Outside属性を使用して、テキストを徐々に短縮するディスプレイ効果を実現する方法は? CSSのShape-Outside属性を使用して、テキストを徐々に短縮するディスプレイ効果を実現する方法は? Apr 05, 2025 pm 10:54 PM

Webデザインでテキストを徐々に短縮するディスプレイ効果を実装する、テキストの長さを徐々に短縮するために特別なテキスト表示効果を実現する方法は?この効果...

&lt; figure&gt; CSSの要素? &lt; figure&gt; CSSの要素? Apr 05, 2025 pm 04:51 PM

CSSの要素は何ですか? CSSの学習と使用中に、&ltなどのあまり一般的ではないHTML要素に遭遇する可能性があります。

フォントファイルをロードせずに、Webページにローカルにインストールされた「Jingnanmai Round」を使用する方法は? フォントファイルをロードせずに、Webページにローカルにインストールされた「Jingnanmai Round」を使用する方法は? Apr 05, 2025 pm 04:54 PM

Web開発のWebページにローカルにインストールされたフォントファイルを使用する方法、コンピューターにインストールされている特定のフォントを使用する必要がある状況に遭遇することがあります...

要素UIのエルテーブルのホバースタイルとロジックを調整する方法は? 要素UIのエルテーブルのホバースタイルとロジックを調整する方法は? Apr 05, 2025 pm 07:45 PM

エルテーブルでマージされた行のホバースタイルとロジックを調整する方法は?要素を使用...

モバイルターミナルでのマルチラインオーバーフローの省略と互換性のある方法は? モバイルターミナルでのマルチラインオーバーフローの省略と互換性のある方法は? Apr 05, 2025 pm 10:36 PM

VUE 2.0を使用してモバイルアプリケーションを開発する際に、さまざまなデバイスで省略されたモバイル端末のマルチローオーバーフローの互換性の問題は、テキストをオーバーフローする必要性に遭遇することがよくあります...

See all articles

      本部门员工
     

     

      <入力タイプ="ボタン" 値="<" name="B5" onclick="moveselect('D2','D1')">

      <入力タイプ="ボタン" 値=">" name="B6" onclick="moveselect('D1','D2')">

     

   

      等待ち划分部门的员工