モーダルビューにアクセス可能な日付ピッカーポップアップを追加しようとしています。 'タイムカードフォーム'をクリックするとモーダルが開きます。モーダル内のタブを使用します。カレンダーアイコンがフォーカスされると、スペースバーがカレンダーポップアップを開きます。このポップアップの中で、月選択アイコン、曜日または閉じるボタンにアクセスするためにタブを使用し、次に選択するために戻ることができます。つまり、タブオーダーはカレンダーポップアップ内に折り返されます。私はまた、矢印キーを使用して、焦点が合っている日を踏むことができるはずです。これはすべて、モーダルの外でdatepickerを使用するときに機能します。 datePickerをモーダルの中に置くと、カレンダーはフォーカスを維持できず、タブでポップアップが閉じられます。モード内のjQueryポップアップDatepickerがフォーカスを維持しない
私は問題がこのコードのビットであるかなり確信している:
// Hide the entire page (except the date picker)
// from screen readers to prevent document navigation
// (by headings, etc.) while the popup is open
$("main").attr('id','dp-container');
$("#dp-container").attr('aria-hidden','true');
$("#skipnav").attr('aria-hidden','true');
私はここにjsfiddleで一緒にすべての部品を引っ張って、いくつかの困難を持っていたが例のURLです:http://lucillekenney-demos.com/sass-muse/time2.html
どんな方向にも大変感謝しています。
p.s. Bootstrapのdatepickerは私がアクセスできないと言われているので使用していません。