Как вставить динамический пиксель отслеживания после нажатия кнопки?

Я имею в виду этот вопрос, который был решен, но это только часть решения, которое я ищу: Как вставить Google Analytics после нажатия кнопки?

Я хочу использовать динамический код отслеживания из базы данных после нажатия кнопки. Вариант использования — подключаемый модуль (для Wordpress). Фактический код отслеживания поступает из базы данных. Он будет запрошен PHP и выполнен только после того, как пользователь даст подтверждение.

Это мой код, пока:

<script type="text/javascript">

    (function( $ ) {

        $("#button").click(function(){

            var pixel = <?php echo $pixel; ?>;

            $('head').append('<script>' + pixel + '</script>');

        });

    })( jQuery );

</script>

person n.r.    schedule 26.03.2018    source источник


Ответы (1)


Пока я писал вопрос и боролся, я нашел решение для себя:

Первое, что не так, это теги script, упомянутые в связанном вопросе. Если я использую встроенный JavaScript, он будет проанализирован, и браузер выдаст ошибку. Но мне нужен встроенный JavaScript, потому что мне нужно запросить пиксель отслеживания с помощью PHP. Поэтому мне нужно создать Script-Element следующим образом:

var script = document.createElement("script");

Следующим шагом является использование специальных символов, таких как разрывы строк, возврат каретки и кавычки. Таким образом, можно не просто отобразить пиксель отслеживания, это также приведет к ошибкам синтаксического анализа, потому что пиксель отслеживания наверняка содержит разрывы строк и кавычки. Поэтому в PHP мне нужно их заменить. Самый простой способ:

var pixel = '<?php echo (str_replace("\n", "", str_replace("\r", "", str_replace("'", "\"", $pixel)))); ?>';

Итак, окончательный и рабочий код будет таким:

<script type="text/javascript">

    (function( $ ) {

        $("#button").click(function(){

            var pixel = '<?php echo (str_replace("\n", "", str_replace("\r", "", str_replace("'", "\"", $pixel)))); ?>';

            var script = document.createElement("script");

            script.innerHTML = pixel;

            document.body.appendChild(script);

        });

    })( jQuery );

</script>
person n.r.    schedule 26.03.2018