Javascript 如何使document.write和ajax更好地发挥作用？_Javascript_Ajax_Jquery Mobile

Javascript 如何使document.write和ajax更好地发挥作用？

javascript ajax jquery-mobile

Javascript 如何使document.write和ajax更好地发挥作用？,javascript,ajax,jquery-mobile,Javascript,Ajax,Jquery Mobile,我的编程技能充其量只是初级的，所以如果我在讨论这些事情时听起来有点笨拙，请原谅我。我在学习，但速度跟黑猩猩一样快这是我的问题：我使用JQuery Mobile通过ajax将一些表单内容作为对话框引入。此内容包含在文档本身的第二个div中，具有data role=“page”属性在第二个页面div中，我有一些javascript定义了几个变量，然后用document.write（）将它们写入文档然而，当我点击链接（导航中最右边的链接）时，Firefox没有弹出一个漂亮的对话框，而是短暂地加载

我的编程技能充其量只是初级的，所以如果我在讨论这些事情时听起来有点笨拙，请原谅我。我在学习，但速度跟黑猩猩一样快

这是我的问题：我使用JQuery Mobile通过ajax将一些表单内容作为对话框引入。此内容包含在文档本身的第二个div中，具有data role=“page”属性

在第二个页面div中，我有一些javascript定义了几个变量，然后用document.write（）将它们写入文档

然而，当我点击链接（导航中最右边的链接）时，Firefox没有弹出一个漂亮的对话框，而是短暂地加载一个带有First var的新页面（不是动态的，而是静态页面），然后重定向回起始页面，在我的浏览器历史记录中留下一个“wyciwyg（00000）…”。根据上述重定向，“WYCIWYG”将显示在浏览器的标题栏中。其他浏览器的阻塞方式略有不同（Safari不重定向，Chrome显示所有变量，不重定向，等等），但历史因素中的WYCIWYG在这三种浏览器中都起作用。如果我删除document.write命令，链接将按预期运行

我在网上搜索了几个小时，却没有找到答案。。。类似的问题也出现在10年前的Mozilla bug报告中，但除此之外没有太多。我找到的唯一解决方案是不在通过ajax加载的内容中使用document.write（）。不幸的是，我不知道替代方案是什么，也不知道我将如何开始执行它。Javascript代码源于Google——一个公交出行计划器的前端代码

下面是一些详细说明问题的代码。考虑到整个黑猩猩的速度，任何指导都将不胜感激。提前谢谢

<!DOCTYPE HTML>
<html>
<head>

<title>WYCIWYG</title> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile.structure-1.2.1.min.css" />
<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.1.js'></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css">
<script type='text/javascript' src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>

<script>

var startExample = "USC";
var endExample = "201 N Los Angeles St.";
var zip = "90012";

</script>
</head>

<body>
<div data-role="page">
<div data-role="navbar">

<ul data-mini="true">
<li><a href="#mNavDash" data-prefetch="true" id="dashLink">Service 1</a></li>
<li><a href="#mNavCE" data-prefetch="true" id="ceLink">Service 2</a></li>
<li><a href="#planTrip" id="planTripLink" data-rel="dialog">PLAN TRIP</a></li>
</ul>
</div>

</div>
<div data-role="page" id="planTrip">
Some document.write js:
<script>
document.write(startExample);
document.write(endExample);
document.write(zip);
</script>
</div>
</body>


WYCIWYG
var startExample=“USC”；
var endExample=“201 N洛杉矶街”；
var zip=“90012”；





一些document.write js：
文件编写（startExample）；
编写文档（endExample）；
文件。编写（zip）；

您只需在占位符元素上使用

jQuery.html（）

：

资料来源：

演示：


一些document.write js：



$（“#planTrip#start”）.html（startExample）；
$（“#planTrip#end”）.html（endExample）；
$（“#planTrip#zip”）.html（zip）；

我有点困惑，因为这就是您试图实现的目标。是否希望“USC 201 N Los Angeles St.90012”显示在模式对话框中？var newEl=document.createElement（'div'）；newEl.innerHTML='startExampleContent
endExampleContent
zip'；document.getElementById（'planTrip'）.appendChild（newEl）；首先，对话框小部件将在JQMV1.4上删除，所以我建议使用弹出小部件。另外，对于jqm1.2和更高版本，使用jqueryv1.8.3或更高版本，最好使用jquery1.9，这让我达到了我需要的位置。在将它整合到实际情况中时，我不得不考虑一些方面，但我很快就实现了。“我现在比以前少了很多，所以谢谢你，”保罗·格里姆说。下一件事…很高兴你成功了。仅供参考，通常

document.write（）

是做某事的错误方式，除非您确切知道自己在做什么-。

<div data-role="page" id="planTrip">
Some document.write js:
<p id="start"></p>
<p id="end"></p>
<p id="zip"></p>
<script>
$("#planTrip #start").html(startExample);
$("#planTrip #end").html(endExample);
$("#planTrip #zip").html(zip);
</script>
</div>