Открыть раскрывающийся список при фокусе ввода - PullRequest
Новая
       35

Открыть раскрывающийся список при фокусе ввода

0 голосов
/ 17 декабря 2018

У меня есть вход, который при нажатии показывает выпадающий список начальной загрузки 4, НО мне нужно, чтобы он открывался, когда пользователь вкладывал его в него, а также для доступности ADA.

Если я использую событие фокуса, которое использует $ ('# input-name) .dropdown (' toggle '), оно работает нормально, но при нажатии на вход сначала фокус срабатывает, что открывает раскрывающийся список, а затем щелчоксобытие закрывает его.

Я пробовал e.preventDefault ();e.stopPropagation ();но ни одна из них не поможет решить эту проблему. 

events: {
  focus #healthPlanMenu": "openDropDown"
}


openDropDown: function (e) {

  if ($('#healthPlanMenu').find('.dropdown-menu:no(.show)')){
    $("#healthPlanMenu.dropdown-toggle").dropdown('toggle');
   }//fails

    $("#healthPlanMenu.dropdown-toggle").dropdown('toggle');//fails
    $( "#healthPlanMenu" ).click();//fails

  }

1 Ответ

0 голосов
/ 17 декабря 2018

Так что в идеале вы, вероятно, решили бы это, если бы событие focus установило состояние раскрывающегося списка таким образом, если оно «открывается» по событию click, не проблема.Однако, насколько я могу судить, есть только опция toggle с jQuery API;кажется излишне ограничивающим ...

Учитывая это, мы можем узнать, будет ли щелчок после нашего события фокуса, используя mousedown.Так что несколько хакерский способ решить эту проблему - отключить событие фокуса, если мы знаем, что идет клик. 

(function() {
	var disable = false;
	$('#healthPlanMenu.dropdown-toggle')
		.on('mousedown touchstart', function() {
			disable = true;
		})
		.on('focus', function() {
			if (!disable) {
				$(this).dropdown('toggle');
			}
		})
		.on('mouseup touchend',function() {
			disable = false;
		})
})()

Я не знаю, нужны ли touchstart и touchend, так как большинство браузеров, вероятно, также запускают события мыши при касании.Но лучше, чем потом сожалеть.

...