フックリファレンス¶
フックとは¶
フックは、フロントエンドの動作を変更する JavaScript プログラム (フックスクリプトといいます) を呼び出すメカニズムです。
フックスクリプトはサイト管理者が追加してください。
フックスクリプトは、フロントエンドからイベントに応じて、フックを通じて呼び出されます。フックを使うことでフロントエンドの動作をある程度変更することができます。
フックの使い方¶
フックを利用するには、サジェスト設定タグのパラメータの値としてフックスクリプトを設定します。フックスクリプトは、JavaScript の関数として実装します。
注意
戻り値が「なし」以外になっているフックでは必ず戻り値を返してください。
戻り値を返さない場合や、指定された以外の戻り値を返した場合の動作は保証されません。
フック一覧¶
activateHook(element)¶
| 説明 | サジェストが起動されたときに呼び出されます。 |
| 引数 | element: 対象となる検索ボックスの input 要素 (Object) |
| 戻り値 | なし |
deviceNameHook()¶
| 説明 | deviceTypeパラメータに、PC用とスマートフォン用の双方のデバイスタイプを指定したときに呼び出されます。デバイスの種類を決定します。詳しくは、「レスポンシブウェブデザインを用いたページへの導入」を参照してください。 |
| 引数 | なし |
| 戻り値 | デバイスの種類を表す文字列。"desktop"または"mobile"のいずれかの文字列でなければなりません。 |
inactivateHook(element)¶
| 説明 | サジェストが終了されたときに呼び出されます。 |
| 引数 | element: 対象となる検索ボックスの input 要素 (Object) |
| 戻り値 | なし |
loadCompleteHook()¶
| 説明 | サジェストがブラウザにロードされ、利用可能な状態になったときに呼び出されます。 |
| 引数 | なし |
| 戻り値 | なし |
searchClickHook(keyword,item)¶
| 説明 | 商品検索結果が選択されたときに呼び出されます。 |
| 引数 | keyword: 商品検索に用いた文字列 (String) item: クリックした商品の情報、このパラメータの詳細は、「引数の詳細」を参照してください。 |
| 戻り値 | 真偽値。falseを返した場合には商品ページへ遷移しません。 |
searchUpdateHook(items)¶
| 説明 | 商品検索結果が更新されたときに呼び出されます。 |
| 引数 | items: 商品検索結果 (Array) |
| 戻り値 | なし |
suggestClickHook(keyword,string)¶
| 説明 | 候補語が選択されたときに呼び出されます。 |
| 引数 | keyword: 選択された候補語 (String) string: 候補語が選択された時点での検索ボックスの値 (String) |
| 戻り値 | なし |
suggestUpdateHook(keywords)¶
| 説明 | 候補語リストが更新されたときに呼び出されます。 |
| 引数 | keywords: 候補語リスト(Array) |
| 戻り値 | なし |
inputHistoryClickHook(keyword)¶
| 説明 | 入力履歴がクリックされたときに呼び出されます。 |
| 引数 | keyword: 選択された入力履歴 (String) |
| 戻り値 | なし |
inputHistoryUpdateHook(keywords)¶
| 説明 | 入力履歴が更新されたときに呼び出されます。 |
| 引数 | keywords: 入力履歴リスト (Array) |
| 戻り値 | なし |
inputUpdateHook(keyword)¶
| 説明 | 検索ボックスの文字列が変化したタイミングで呼び出されます。 |
| 引数 | keyword: 検索ボックスの文字列 (String) |
| 戻り値 | なし |
deviceReadyHook(device)¶
| 説明 | サジェストによって生成された DOM が利用可能になったタイミングで呼び出されます。 loadCompleteHook よりも遅いタイミングで呼ばれ、DOM の生成と CSS の読み込みが保証されます。 |
| 引数 | device: デバイス情報 (Object) └ userArea: ユーザ領域に関する情報 (Object) └register: ユーザ領域を登録する関数 (function) 引数にユーザが作成した dom を渡すことで、dom をサジェストの制御下に置くことができます。 |
| 戻り値 | なし |
customSuggestNClickHook(name, link, icon)¶
| 説明 | カスタム候補語が選択されたときに呼び出されます。 |
| 引数 | name: 候補語 link: 遷移先 URL icon: icon の URL |
| 戻り値 | 真偽値。false を返した場合にはページへ遷移しません。 |
customSuggestNUpdateHook(customN)¶
| 説明 | カスタム候補語リストが更新されたときに呼び出されます。 |
| 引数 | customN: カスタム候補語リスト (Array) 各要素は以下の型を持つオブジェクトです。 name: 候補語 link: 遷移先 URL icon: icon の URL |
| 戻り値 | なし |
フックの利用例¶
下記の例では、サジェストが利用可能になったときに、ブラウザのコンソールに「サジェスト is here」という文字列を表示します。
var poplink3 = {
uid: "[UID]",
target: "#q",
deviceType: "pc011",
loadCompleteHook: function() { console.log('サジェスト is here') },
};