FC2ブログ

javascript で検索アルゴリズム

まず、ready() を作成し
検索ボタンがクリックされたら
テキストフィールをの値を引数にして検索を実行

クリアボタンがクリックされたら、div エレメントの内容をクリアするというもの

まず
ready() の中身から

search属性のボタンがクリックされたら
val() でテキストフィールドの値を取り出して
それを引数にして searcyh() を呼び出し
ちなみに。search() は自作関数

続いて、クリアボタンがクリックされたら、
empty() を使って
display 属性のついている内容をクリア
さらに
title 属性のついているテキストもクリアする

コードにすると
[php]
$(funcrion(){
//検索を実行
$("#search").click(function(){
search($("keyword").val());
});

//検索結果をクリア
$("#clear").click(funcrion(){
$("#display").empty();
$("#title").text("");
});
});
[/php]
となります

続いて
検索する search() という関数の自作

function search(keyword){
//ローディング中
$("#title").text("Loading .....");

$.ajax({
dataType:"jsonp",
data:{
"term":keyword,
"country":"jp",
"media":"music",
"entity":"album",
"limit":"10"
},
url: "http://ax.itunes.apple.com/WebObjects/MZStoreServices.woa/wa/wsSearch",
success: funcrion(data){
$("#title").text("");
$.each(data.results,function(i, item){
$("")
.attr("href", item.collectionViewUrl)
.appnd("")
.mouseover(function(){
$("#title").text(item.collectionName);
})
.appendTo("#display");
});
}
});
}

$("#title").text("Loading .....");
は読み込み中の時に表示する文字列です
ネット速度が早いとでないかも...


data:{
"term":keyword,
"country":"jp",
"media":"music",
"entity":"album",
"limit":"10"
},

iTunes Store Web API に送信するパラメータの指定です

ちなみに、
term はキーワードですが、これを
keyword という変数にしておくことで
検索キーワードで調べることが可能になっています
このkeyword は

<input type="text" id="keyword">
で得たデータになっています

ちなみに、jsoncallback は指定していないけど
自動的に設定されるので問題無し

url: "http://ax.itunes.apple.com/WebObjects/MZStoreServices.woa/wa/wsSearch",

Web API のURLとなります

最後の
success: funcrion(data){
$("#title").text("");
$.each(data.results,function(i, item){
$("
")
.attr("href", item.collectionViewUrl)
.appnd("")
.mouseover(function(){
$("#title").text(item.collectionName);
})
.appendTo("#display");
});
はデータ取得成功のときの処理で
.attr("href", item.collectionViewUrl)
はhref 属性を web API へ

.mouseover(function(){
$("#title").text(item.collectionName);
はマウスを乗せたときの処理で
これにより 画像にマウスを乗せると
アルバム名が表示されます

ちなみに、iTunes の Web API を使っているため
アルバム画像をクリックすると
iTunes の画面に飛びます

これとアフィリエイトと組み合わせるといろいろとおもしろいことができそうです

iTunes Store Web Service Search API アフィリエイト
と検索すると、ヒントなどがでてきます

スポンサーサイト



テーマ : プログラミング
ジャンル : コンピュータ

コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック