ホーム > JSON (全3件)
  • オートコンプリートを設定する

    idがfoodのinput要素にオートコンプリートを設定する。

    /* コンプリート候補に変数を指定 */
var foods = [ 'apple', 'blueberry', 'cherry', 'melon', 'orange' ];
$( '#food' ).autocomplete( { source: foods } );

/* コンプリート候補にURL（JSONデータ）を指定 */
$( '#food' ).autocomplete( { source: 'http://localhost/foods.json' } );

/* コンプリート候補にコールバック関数を指定 */
$( '#food' ).autocomplete( { source: function ( req, add ) {
	var candidacy = [];
	for ( key in foods ) {
		if ( foods[key].indexOf( req.term ) >= 0 )
			candidacy.push( foods[key] );
	}
	add( candidacy );
} } );

    初期化時、オートコンプリート候補の指定方法は配列、URL、コールバック関数の3種類になる。コールバック関数を指定した場合は、初期化時ではなく、表示する候補を更新するタイミング毎に呼び出される。なおui-menuクラスのスタイルにfloat: left;が指定されていない場合、候補リストの幅が入力ボックスよりも大きくなるので注意。
    IE7で動作しない場合はjQuery UI 1.9.1にアップデートを。

    キーワード:
  • ajaxでJSON形式のデータを取得する

    ajaxでJSON形式のデータを取得する。

    jQuery.ajax( {
	type: 'POST',
	url: '/url',
	data: 'name1=value1&name2=value2',
	dataType: 'json',
	success: function( dataResponse, textStatus, jqXHR ) {
		// データ取得時の処理を
	},
	error: function( jqXHR, textStatus, errorThrown ) {
		// データ取得失敗時の処理を
	}
} );

    typeには’POST’または’GET’を、dataには必要に応じて「name1=value1」の形式でパラメータを、dataTypeには’json’のほか’xml’、’html’、’text’などが指定できる。successのコールバック関数の指定はfunction( dataResponse ) {}のようにデータを受け取る変数だけでも構わない。

    キーワード:
  • JSONテキストをパースする

    変数jsontextの内容をパースしてオブジェクトに変換する。

    try {
	var jsonobj = jQuery.parseJSON( jsontext );
} catch (e) {
	// パースエラー時の対応をここで
}

    変数の内容が正しいJSON形式でない場合は例外が発生するので、基本的にはcatchすること。

    キーワード:
 
 
ツールバーへスキップ