【フォーム】出し分け設定の詳細

2022.11.10 更新
Text=kintsuba
回答内容によって、次の表示内容を出し分けます。

下記フォームサンプルページを元に説明します。
フォームサンプルページをブラウザ上でソースコードをご確認いただくか、ファイルをダウンロードして内容をご確認ください。
>フォームサンプルページフォームサンプルダウンロード

※ソースコード確認方法
対象ページをChromeブラウザで開いて下記操作を行ってください。
windows:Ctrl + U
mac:option + command + U


■編集ファイル:index.html

(1)全体の質問を非表示にして、初期表示させる部分を設定
※今回は説明用にCSSを<head></head>内に書き込んでいますが、style.cssに書き込んでもOKです。
(2)Javascriptで出し分け処理を設定します。
①質問2のラジオボタンが変更されたら処理がスタートします。
②のif文は休止が選択された時の処理を記入(225行目まで)
③質問2-1の休止期間選択を表示
④質問3、エントリーボタンは非表示にする
⑤のif文はスキップが選択された時の処理を記入(231行目まで)
⑥質問2-1の休止期間、質問3は非表示にする
⑦エントリーボタンを表示
⑧質問2-1の休止期間の選択を解除
⑨のif文は解約が選択された時の処理を記入(236行目まで)
⑩質問3以降を表示
⑪質問2-1の休止期間、エントリーボタンは非表示にする
⑫質問3を表示
⑬次の質問にスクロールする処理、id="scrollAnchor"までスクロールする
ご希望通りのセッティングができましたか?

0人中0人がセッティングができたと言っています。

このマニュアルの作成者は kintsuba です。

こちらのマニュアルで希望のセッティングが出来なかった
際は、下記のどちらかでお問い合わせください。

フリープランの方はこちら
LINE公式アカウント機能拡張プラン、
オートコールセンタープランの方はこちら