ホームページ  >  記事  >  ウェブフロントエンド  >  jquery json ユニバーサル 3 レベル リンケージ ドロップダウン list_jquery

jquery json ユニバーサル 3 レベル リンケージ ドロップダウン list_jquery

WBOY
WBOYオリジナル
2016-05-16 18:29:031286ブラウズ

著者: shaoyun
メール: shaoyun (at)Yeah.net
日付: 2010-03-10 02:03
ブログ: http://shaoyun.cnblogs.com/

使用Jquery 実装、元のコードは IE のみをサポートしています。ここで変更しました。コードには 3 つのバージョンの実装があります
最初のものは XML を読み取ることによって構築され、IE/Firefox をサポートします。Chrome はサポートしません。興味があれば、Chrome サポートが問題にならないように、XML 読み取り部分を AJAX に変更できます
2 番目のものは、Json データ形式を使用して構築されています。これは、それを改善するための 2 回目の試みです
3 番目のものは、実際には2番目のものと同じですが、データはJSファイルに分割されており、ページが直接ASPファイルを呼び出す場合、データベースを呼び出してJsonの州と市のデータを生成します。 JS ファイルを生成した後は、速度が非常に遅くなります。直接呼び出す方がはるかに速く、データのこの部分は通常変更されません。


更新記録:

2010 -04-19 12:11:24
追加
では、div、table、td などのページ要素に限定されるのではなく、ページ上の任意の場所に選択を配置できます。内部の
パラメーターは次のようになります。 /s3 は選択 ID を構成します。v1/v2/v3 はデフォルト値です。設定したくない場合は、null に設定するか、

パラメーターの構成を直接設定しないでください。以下のように設定します。selectの3つのIDとデフォルト値で十分です。デフォルト値がない場合はnullを記入してください

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

var defaults = {
s1:'Select1',
s2:'Select2',
s3:'Select3',
v1:null,
v2:null,
v3:null
};

これは、ディレクトリ内の php ファイルは、によって生成されたデモです。サーバー データであり、使用の参照として使用されます

データ形式の定義は次のようになります:

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

var threeSelectData= {
"province":{val:"",items:{"city":{val:"" ,items:{"地区と県":""}}}},
"北京":{ val:"01",items:{
"bj-01":{val:"0101", items:{
"bj-01-01":"010101"
}}、
"bj-02":{val:"0102",items:{
"bj-02- 01":"010201",
"bj-02-02":"010202"
} }
}},
"山西":{val:"02",items:{} },
"広州":{val:"02",items:{}}
} ;


コード例:

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