Блог

Я пытаюсь добавить флажок, который гласит: «Включить привязку: []». Если пользователь нажмет на этот флажок, я хочу проверить, установлен этот флажок или нет. Но я получаю сообщение об ошибке типа: document.getElementById(…) равно нулю.

Ниже приведен код:

 instance.setHeaderItems(header => {
    header.getHeader('toolbarGroup-Annotate').unshift({
        type: 'customElement',
        render: function() {
            const checkbox = document.createElement('input');
            checkbox.type = 'checkbox';
            checkbox.name = 'snap-to-grid';
            checkbox.value = '1';
            checkbox.id = 'snap-to-grid';
            checkbox.onclick = function(evt) {
                alert(document.getElementById('snap-to-grid').checked);
            };
            return checkbox;
        }
    });
});
  

Итак, есть ли способ узнать, установлен этот флажок или нет? Также как я могу добавить текст перед флажком?

WebViewer запускается внутри iframe на вашей странице. Когда мы визуализируем эти пользовательские кнопки, они также находятся внутри этого iframe. Чтобы получить доступ к элементу в вашем случае, вам сначала нужно получить документ iframe. Это должно сработать для вас

 instance.setHeaderItems(header => {
    header.getHeader('toolbarGroup-Annotate').unshift({
      type: 'customElement',
      render: function() {
        const checkbox = document.createElement('input');
        checkbox.type = 'checkbox';
        checkbox.name = 'snap-to-grid';
        checkbox.value = '1';
        checkbox.id = 'snap-to-grid';
        checkbox.onclick = function(evt) {
          alert(instance.iframeWindow.document.getElementById('snap-to-grid').checked);
        };
        return checkbox;
      }
    });
  });