jquery mobile listbox_jqueryの値の原則とコード

jQuery のリストボックス操作の原理は難しくありません。リストボックス内で選択した項目を移動して、必要な移動効果を実現することです。この例では、json データ構造を使用してリストボックスを動的にバインドしました。これにより、json の使用にも慣れることができます。

まず単純な HTML を見てみましょう。サーバー コントロールは自動的に HTML タグに変換されるため、この例ではサーバー コントロールを使用しませんでした。次のように:

は次のように変換されます:

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

" id="btnRight" value =">>" />

コードをコピー

コードは次のとおりです: //data var vData = { "datalist ": [

{ "data" : "jQuery", "text": "jQuery" },

{ "data": "Asp.net", "text": "Asp.net" },
{ "データ": "インターネット" , "テキスト": "インターネット" },
{ "データ": "Sql", "テキスト": "Sql" }
]



以下は jQuery 実装コードであり、要所にコメントが含まれています。

コードをコピー

コードは次のとおりです: //データをバインド var vlist = "" ; //json データをトラバースします

jQuery.each(vData.datalist, function(i, n) {

vlist = "" n .text " });
//データを listLeft にバインド
$("#listLeft").append(vlist); >$ ("#btnRight").click(function() {
//data オプションで選択されたデータセットは変数 vSelect
var vSelect = $("#listLeft option:selected") に割り当てられます;
// クローンデータが listRight に追加されます
vSelect.clone().appendTo("#listRight");
// listRight のオプションも削除します
vSelect.remove(); 🎜>});
//右に移動
$("#btnLeft").click(function() {
var vSelect = $("#listRight option:selected");
vSelect .clone().appendTo("#listLeft");

このウェブサイトの声明

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

ホットAIツール

Undresser.AI Undress

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

AI Clothes Remover

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

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

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

もっと見る

人気の記事

R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）

2週間前 By 尊渡假赌尊渡假赌尊渡假赌

スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか？

1 か月前 By DDD

R.E.P.O.最高のグラフィック設定

2週間前 By 尊渡假赌尊渡假赌尊渡假赌

アサシンのクリードシャドウズ：シーシェルリドルソリューション

1週間前 By DDD

R.E.P.O.誰も聞こえない場合はオーディオを修正する方法

2週間前 By 尊渡假赌尊渡假赌尊渡假赌

もっと見る

ホットツール

メモ帳++7.3.1

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

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？

7401

15

Java チュートリアル

1630

14

CakePHP チュートリアル

1358

52

Laravel チュートリアル

1268

25

PHP チュートリアル

1217

29

もっと見る