Выбранный ввод текста по умолчанию (фокус) в ContextMenu - PullRequest
0 голосов
/ 09 ноября 2018

У меня есть текстовое поле, сгенерированное контекстным меню, и я хочу, чтобы оно было выбрано по умолчанию (автофокус по умолчанию). У меня не получается с функцией jquery focus

Ответы [ 2 ]

0 голосов
/ 09 ноября 2018

Установите focus в секции events.show.
Вам нужно будет timeout, чтобы элемент input появился в DOM перед установкой focus.
Имя input будет иметь префикс context-menu-input-.

См. Фрагмент ниже:

$(function() {
  $.contextMenu({
    selector: '.context-menu-one',
    items: {
      // <input type="text">
      input1: {
        name: "Text",
        type: 'text',
        value: "Hello World",
        events: {
          keyup: function(e) {
            window.console && console.log('key: ' + e.keyCode);
          }
        }
      }
    },
    events: {
      show: function(opt) {
        var $this = this;
        $.contextMenu.setInputValues(opt, $this.data());
        
        // Set focus to the input element
        setTimeout(() => {
          $('[name="context-menu-input-input1"]').focus();
        }, 10);
      },
      hide: function(opt) {
        var $this = this;
        $.contextMenu.getInputValues(opt, $this.data());
      }
    }
  });
});
<link href="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.css" rel="stylesheet" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.js" type="text/javascript"></script>


<span class="context-menu-one btn btn-neutral">right click me</span>

Надеюсь, это поможет.

0 голосов
/ 09 ноября 2018

Вы можете попытаться установить свойство автофокуса?

$(function(){
        $.contextMenu({
            ...
                name_input: {
                    name: "Name input :", 
                    autoFocus: true,
                    type: 'text', 
                    ...
...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...