行ったこと
select
,option
要素の実装、修正
困ったこと
モーダルの中に、input
要素で記述式の質問回答欄を、select
option
要素で選択肢の回答欄を実装。
回答を記入及び選択肢を選んだ後、submit
等イベントを実行すると、
(モーダルを閉じるとともに)input
欄を空欄にし、select
要素の表示を元に(選択される前の状態)戻したい。
うまく言語化が出来ておりませんが、コードは以下の通りです。
HTML
<input id="example" type="text">
<select id="question">
<option selected>選んでください</option>
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
<option value="4">d</option>
</select>
<button id="submitButton" type="submit">送信</button>
インプット欄、選択欄、ボタンを実装しました。
ボタンを押すと、インプット欄を空欄に戻し、かつ選択欄を「選んでください」が
表示されるように戻す。
jQuery
$('#submitButton').on('click', () => {
$('#example').val("");
$('#question').val($('#question option[selected]').val());
});