Wordpress環境、条件検索フォーム（php、JS）のフィールド出し分けについて質問です

Wordpress環境、条件検索フォーム（php、JS）について質問です。
当方、プログラミングは初心者レベルです。

Wordpressのカテゴリ機能で、現在下記のようなカテゴリがあります。
例）
エリア
┗アジア
┗日本
┗中国
┗韓国
┗北米
┗アメリカ
┗カナダ

これらの条件検索フォームをドロップダウンフィールドで作成したいのですが、

　フィールド１　　：　アジア,北米
フィールド２－１：　日本,中国,勧告　　→最初は非表示、フィールド１で「アジア」が選択されたら表示
フィールド２－２：　アメリカ,カナダ　 →最初は非表示、フィールド１で「北米」が選択されたら表示

こういった動きが作れればと思っています。

現在は下記コードで、指定カテゴリの子のみをドロップダウンフィールドに反映させることはできています。

<form method="get" id="searchform" action="検索結果ページURL"> <input type="text" name="s" id="s" placeholder="検索" /> <select name="catnum"> <option value="" selected>エリア別</option> <?php $categories = get_terms( 'category', array( 'orderby' => 'count', 'hide_empty' => 0, 'child_of' => 3, //親カテゴリのIDです ) ); foreach($categories as $category) : ?> <option value="<?php echo $category->term_id; ?>"><?php echo $category->name; ?></option> <?php endforeach; ?> </select> <input type="submit" value="検索" /> </form>

これで「フィールド１」だけは作成できており、「フィールド２－１」「フィールド２－２」も複製していけばできると思うのですが
「フィールド１」の内容に合わせて「フィールド２－〇」を出しわける方法がわからず、、

画面遷移はしたくないのでおそらくJSを使うのだろうと思うのですが、わかる方いましたらご教授いただけますと幸いです。

お手数おかけしますが、よろしくお願いいたします。