Как сделать интерактивный HTML-текст, который загружает

81
8

Привет, я пытаюсь вставить в свой блог какой-то интерактивный текст, в котором всплывающее окно

<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BvFE6&webforms_id=2645901"></script>

будет появляться. Как это сделать правильно? благодаря

спросил(а) 2016-01-03T03:33:00+03:00 4 года, 9 месяцев назад
1
Решение
71

Если требование не позволяет использовать jquery, вы также можете использовать javascript для добавления скрипта во время выполнения, используя следующий код:

<!doctype HTML>
<html>
<head>
<title>Append script on runtime</title>
<style type="text/css">
#text-link {
color: blue;
cursor: pointer;
}
</style>
</head>
<body>
<div id="blog-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam pretium sodales turpis.
<span id="text-link">fermentum lacinia</span> ligula. Aliquam erat volutpat.
</div>

<script type="text/javascript">
window.onload = function() {

document.getElementById("text-link").addEventListener("click", addScript);

function addScript(){
var script = document.createElement('script');
script.src = 'https://app.getresponse.com/view_webform_v2.js?u=BvFE6&webforms_id=2645901';
document.head.appendChild(script);

// if wants to support IE < 9 then instead of document.head use
// document.getElementsByTagName('head')[0]
}

}
</script>

</body>
</html>

Вы можете дополнительно улучшить код, чтобы добавить его только один раз, если он уже существует.

ответил(а) 2016-01-04T18:48:00+03:00 4 года, 9 месяцев назад
41

вам нужно добавить скрипт на страницу:


X.onclick = function(){
var myScript = document.createElement('script');
mySript.src='...';
document.querySelector('head').appendChild(script);
}

ответил(а) 2016-01-03T03:40:00+03:00 4 года, 9 месяцев назад
-4

Мы можем использовать jQuery для добавления скрипта во время выполнения, используя следующий код:

$("<script>", {
src: "https://app.getresponse.com/view_webform_v2.js?u=BvFE6&webforms_id=2645901",
type: "text/javascript"
}).appendTo("body");

Мы можем использовать один и тот же скрипт при щелчке по элементу. См. Приведенный ниже код для рабочего примера.

<!doctype HTML>
<html>
<head>
<title>Append script on runtime</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style type="text/css">
#text-link {
color: blue;
cursor: pointer;
}
</style>
</head>
<body>
<div id="blog-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam pretium sodales turpis.
<span id="text-link">fermentum lacinia</span> ligula. Aliquam erat volutpat.
</div>

<script type="text/javascript">
$(document).ready(function() {
$("#text-link").on("click", function() {
$("<script>", {
src: "https://app.getresponse.com/view_webform_v2.js?u=BvFE6&webforms_id=2645901",
type: "text/javascript"
}).appendTo("body");
});
});
</script>

</body>
</html>

ответил(а) 2016-01-03T06:45:00+03:00 4 года, 9 месяцев назад
-4

<p class='appendScriptTag'> click me </p>

<script>

$('.appendScriptTag').on('click',function(){
var s = document.createElement("script");
s.type = "text/javascript";
s.src = "https://app.getresponse.com/view_webform_v2.js?u=BvFE6&webforms_id=2645901";
$("head").append(s);
})

</script>

ответил(а) 2016-01-03T03:45:00+03:00 4 года, 9 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема