Document.write созданный скрипт не работает - PullRequest
0 голосов
/ 05 марта 2019

У меня есть готовый JQuery для перемещения объекта (изображения) на 360 ° с помощью действий мыши.

Код работает:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery j360 Plugin Demo</title>
<script src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/j360.js" ></script>
</head>
<body>
<div class="jquery-script-clear"></div>
<h1 style="margin-top: 150px;">jQuery j360 Plugin Demo</h1>
<script type="text/javascript">
            jQuery(document).ready(function() {
                jQuery('#product').j360();
            });
</script>
<center>
<div id="product" style="width: 1920px; height: 1080px; overflow: hidden;"> 
<img src="v/1.png" /> 
<img src="v/2.png" /> 
<img src="v/3.png" /> 
<img src="v/4.png" /> 
<img src="v/5.png" /> 
</div>
</center>
</body>
</html>

Необходимые изображения получены по запросу отсервер, поэтому я должен создать этот код по требованию после получения фотографий.Поэтому я использую команды document.write - я знаю, что это не лучшая практика, но обычно это работает ... Во всяком случае, это код, который я использую - в основном то же самое (даже когда я отлаживаю, я не могу найти разницу всоздал HTML в «оригинальный» HTML)

Так что в основном это так:

<button id="click1" onclick="myFunction()">click me</button>

<script>
function myFunction() {
document.writeln('<html>');
document.writeln('<head>');
document.writeln('<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">');
document.writeln('<title>jQuery j360 Plugin Demo</title>');
document.write('<scr');
document.write('ipt src="js/jquery-1.4.4.min.js"></scr');
document.write('ipt>');
document.write('<scr');
document.write('ipt type="text/javascr');
document.write('ipt" src="js/j360.js" ></scr');
document.writeln('ipt>');
document.writeln('</head>');
document.writeln('<body>');
document.writeln('<div class="jquery-script-clear"></div>');
document.write('<scr');
document.writeln('ipt type="text/javascript">');
document.write('            jQuery(document).ready(func');
document.writeln('tion() {');
document.write("                jQuery('");
document.write('#');
document.writeln("product').j360();");
document.writeln('            });');
document.write('</scr');
document.writeln('ipt>');
document.writeln('<center>');
document.writeln('<div id="product" style="width: 960px; height: 540px; overflow: hidden;">'); 
document.write('<img src="images/01.jpg" />');
document.write('<img src="images/02.jpg" />');
document.write('<img src="images/03.jpg" />');
document.writeln('</div>');
document.writeln('</center>');
document.writeln('</body>');
document.writeln('</html>');
}
</script>

Созданный HTML показывает картинку, но плагин jQuery не работает.JS одинаковы.

Спасибо за вашу помощь!

1 Ответ

0 голосов
/ 05 марта 2019

document.write заменяет любой ваш код.

Пример:

function overwrite() {
  document.write("Oops, I've overwritten the code!");
}
<!doctype html>
<html>

<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph</p>
  <button onclick="overwrite()">Click me!</button>
</body>

</html>
...