ハッシュタグでツイート検索

ハッシュタグでツイート検索

Twitter Search APIを使うことで
検索フォームに入力したハッシュタグでツイート検索して
一覧表示する

また、ツイートは内容以外に
ツイートしたユーザーとプロフィール画像も表示する

さらに、利便性向上のため
検索フォームでは、入力フォーム内で
Enterが押されたら検索開始するようにする

index.htmlで
まずhead要素の中で
jquery.mobile-1.1.0.min.css
jquery-1.7.1.min.js
jquery.mobile-1.1.0.min.js
そして、処理するJavascriptの
searchtwitter.js
を読み込む

<div data-role="fieldcontain">
<label for="search">ハッシュタグ:</label> # <input type="search" name="search" id="search-tag" value="android"/>
</div>

これで、ハッシュタグで検索する入力フォームを作成

input で type=”search” にすると
検索アイコンのついた入力フォームになる

<div data-role="fieldcontain">
</div>

で囲んでいるのは
レイアウトが崩れるのを防ぐため

ツイート一覧表示の領域は

<div id="tweet">
</div>

として、divで表示領域を指定する

これで画面はできたので
処理はJavascriptで行う