Генерация Qr-кода путем передачи document.createElement не работает

Я работаю над проектом, который генерирует случайный код qr. Это плагин, который я использую http://davidshimjs.github.io/qrcodejs/

function createQrImage(qrValue){

    //option1
    var newDiv = document.createElement("div");

    //option2
    var qrDiv = document.getElementById("myDivId");

    //only option 2 works
    var qrcode = new QRCode(qrDiv);

    qrcode.makeCode(qrValue)
}

Создание нового QR-кода с использованием опции 2 работает нормально, но если я передам переменную опции 1, QR-код не будет сгенерирован. В консоли ошибок тоже нет.

Вам нужно создать новый элемент на лету или вы можете передать функцию createQrImage div, который существует в DOM? Ему либо нужен идентификатор, либо он хочет, чтобы div уже где-то существовал.

Bryan 26.06.2019 18:03

Вы пробовали document.body.appendChild(newDiv); перед тем, как вызвать QRCode?

imvain2 26.06.2019 19:01

Вы нигде не добавляете newDiv в документ.

user47589 26.06.2019 19:09

Большое спасибо @imvain2. Он работает после добавления этого кода. Спасибо еще раз

Waleedh Naim 26.06.2019 19:50
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
4
146
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Согласно моему комментарию, поскольку newDiv нигде не добавляется в DOM, ссылка на него не повлияет на вывод. Поэтому вам нужно будет добавить его к телу перед его использованием.

function createQrImage(qrValue){

    //option1
    var newDiv = document.createElement("div");
    document.body.appendChild(newDiv);

    //option2
    var qrDiv = document.getElementById("myDivId");

    //only option 2 works
    var qrcode = new QRCode(qrDiv);

    qrcode.makeCode(qrValue)
}

Другие вопросы по теме