简体   繁体   English

Document.write创建的脚本不起作用

[英]Document.write created script does not work

I have a finished JQuery for moving a 360° object (picture) with mouse actions. 我有一个完成的JQuery,可以使用鼠标动作来移动360°对象(图片)。

The code is working: 该代码正在工作:

<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>

The needed pictures are received on demand from a server, so I have to create this code on demand after receiving the pictures. 所需的图片是根据需要从服务器接收的,因此我必须在收到图片后按需创建此代码。 I use therefore document.write commands - I know they are not best practice, but usually it works ... Anyway this is the code I use - basically the same (even when I'm debugging I can't find a difference in the created HTML to the "original" HTML) 因此,我使用document.write命令-我知道它们不是最佳实践,但通常可以正常工作……无论如何,这是我使用的代码-基本相同(即使在调试时,我也无法找到区别将HTML创建为“原始” HTML)

So basically it's like that: 所以基本上就是这样:

<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>

The created HTML shows the picture but the jQuery plugin is not working. 创建的HTML显示图片,但jQuery插件不起作用。 The JS are the same. JS是一样的。

Thank for your help! 谢谢您帮忙!

document.write overwrites any code you have. document.write覆盖您拥有的所有代码。

Example: 例:

 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> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM