ajax动态加载html和js的问题

代码小天王 2012-06-19 03:12:38
有这么个需求,我在页面上有很多个按钮,点击按钮之后,使用ajax请求服务端,服务端返回动态生成的html内容和很多js脚本段。下面是生成的内容:

<div id="container" class="I_list_Ul evenRow highLight"><dl class="li01 textList clear2"><dt>系统设定建站限值个数:</dt><dd><input class="text" maxsize="4" type="text" id="511031" name="511031" value="11"><span class="formTip">(必须输入整数)</span><script language="javascript" type="text/javascript">alert(1);function Validate511031(){var ctl=document.getElementById('511031');if(ctl.value.length==0){alert('该项不能为空!');return false;}if(!({0}<=ctl.value.length<={1})){alert('字符个数必须在{0}位到{1}位之间!');return false;}}</script></dd></dl><div class="formButton"><span><input class="submit" type="button" value="提交" id="FormSubmit" onclick="ShareConfig.PostControlData();"></span><span><input class="button" type="button" value="取消"></span> </div></div>


上面是我服务端动态返回的内容,然后我使用node.innerHTML设置我一个div的html内容,问题出来了,这样子可以绑定html内容,但是script脚本段不能绑定上去,不能进行解析和调用。

上面的是个例子,我可能会有很多个input,和很多个script脚本段,我现在能想到的解决方案是,当我接收到这段内容,用正则去匹配script标记,然后我使用js动态输出script,或者动态创建节点。

但是我想找一个更好的解决方案
...全文
8424 48 打赏 收藏 转发到动态 举报
写回复
用AI写文章
48 条回复
切换为时间正序
请发表友善的回复…
发表回复
zx772445202 2014-03-19
  • 打赏
  • 举报
回复
楼主怎么解决的?我这边有个问题,客户端ajax到服务器端一个html文件,传可几个参数,然后客户端页面在加载那个html,那个html里有客户端传的参数,这个该怎么做? 楼主好人一生平安呐!!!
itscat 2013-10-31
  • 打赏
  • 举报
回复
动态执行ajax请求里的js代码 http://3aj.cn/article/4970.html
代码小天王 2012-06-27
  • 打赏
  • 举报
回复
哥 你还是没看懂我的需求 不过现在已经解决了
[Quote=引用 45 楼 的回复:]

js是在客户端执行的代码,没必要再次由服务器发送,你可以在页面加载时将所有数据一次性加载过来;然后再用js控制Dom的方式来控制页面行为。即使需要从服务器上加载html,也可以先把js代码预加载过来。
[/Quote]
warlock 2012-06-27
  • 打赏
  • 举报
回复
js是在客户端执行的代码,没必要再次由服务器发送,你可以在页面加载时将所有数据一次性加载过来;然后再用js控制Dom的方式来控制页面行为。即使需要从服务器上加载html,也可以先把js代码预加载过来。
erictang2003 2012-06-25
  • 打赏
  • 举报
回复
全面改为jquery + ashx ,javascript非常好用
tonggongzi 2012-06-22
  • 打赏
  • 举报
回复

ajax填充innerHtml的script内容不会被执行

完美动态加载javascript的方法是:

使用正则表达式读取ajax加载内容中的<script>....</script>
然后用生成一个script节点,把字段中的内容填充到这个节点中,最后把这个节点放到head节点内,javascript就会立刻执行,之后可以把这个节点删除

  • 打赏
  • 举报
回复
对于页面第一次加载也是一样地!在页面上应该只有<div>等分层、分区标记的数据,然后引用一个js方法,这个方法在页面数据下载完之后开始动态渲染界面,这才产生最终的界面。

纯粹的客户端编程,(几乎)不需要下载什么html代码。html只是在客户端动态产生的。
  • 打赏
  • 举报
回复
[Quote=引用楼主 的回复:]
有这么个需求,我在页面上有很多个按钮,点击按钮之后,使用ajax请求服务端,服务端返回动态生成的html内容和很多js脚本段。下面是生成的内容:
[/Quote]

最近对html/javascript远离,懒得看这类问题了。

既然你使用纯客户端编程,那么你的服务器应该返回的是数据(ajax json对象),然后客户端根据数据去产生html和动态加载js。返回“html内容和js脚本段”干什么?
代码小天王 2012-06-22
  • 打赏
  • 举报
回复
大师,也许asp.net在你们眼中如此不堪,但是我热爱它,我觉得对于我来说asp.net不只是一个发展方向,也是一种兴趣爱好,我不喜欢其他语言,只喜欢C#,只喜欢asp.net平台,这种一见钟情的感觉很爽。哈哈。

还有上面您给我提的建议,如果我页面上有很多的其他内容呢,比如说很多图片,div等等其他内容,我动态加载的html和js只是其中一块,如果我使用asp.net回发的话,用户体验首先肯定会不好,再者,您肯定也知道,我页面上很多input这些如果使用aspnet postback的话,会造成很多冗余数据在客户端和服务器之间传输,我觉得没必要,很感谢您回答我的问题,一直都是很尊敬您,也是一直关注您,在像你学习
[Quote=引用 42 楼 的回复:]

如果是偶尔作为课堂练习,那么使用什么方式是无所谓的。但是我们多测试一些,就知道该往哪一个方向发展了。

asp.net的毛病我已经不指望它有什么改变了。所以我倾向于抛弃asp.net,使用任意一款轻量级的web服务开发工具。
[/Quote]
  • 打赏
  • 举报
回复
如果是偶尔作为课堂练习,那么使用什么方式是无所谓的。但是我们多测试一些,就知道该往哪一个方向发展了。

asp.net的毛病我已经不指望它有什么改变了。所以我倾向于抛弃asp.net,使用任意一款轻量级的web服务开发工具。
  • 打赏
  • 举报
回复
“我这种做法不管是服务器端还是客户端,相对不管是性能还是效率都提高了”我想你只是在个人电脑上测试过“性能还是效率”。你的服务器负责每一个客户端的渲染,而客户端则只做很少的工作,你能测出结果说这种反而是比合理利用客户端机器进行分布式操作要提高了效率?


那你何不仅仅使用真正的asp.net代码呢?为啥么要写javascript代码呢?
代码小天王 2012-06-22
  • 打赏
  • 举报
回复
大师,你说的这个我不太赞同,我明白你的意思,在服务端返回 json数据,客户端再解析这个json,然后动态生成我的html和js,那么我认为,同样是我在客户端ajax请求服务器,同样是返回一个字符串,况且,如果我返回json的话,长度更长,为什么不能在服务端把html拼接出来,客户端再接受html,render进行显示,这样客户端还不用去解析我的json,我那种做法,和asp.net的处理过程也是差不多的,asp.net ajax并不是返回json吧,我这种做法不管是服务器端还是客户端,相对不管是性能还是效率都提高了
[Quote=引用 37 楼 的回复:]

对于页面第一次加载也是一样地!在页面上应该只有<div>等分层、分区标记的数据,然后引用一个js方法,这个方法在页面数据下载完之后开始动态渲染界面,这才产生最终的界面。

纯粹的客户端编程,(几乎)不需要下载什么html代码。html只是在客户端动态产生的。
[/Quote]
  • 打赏
  • 举报
回复
数据中的js只要使用 eval 就能执行了!
李世垚 2012-06-21
  • 打赏
  • 举报
回复
用了IFrame 还用ajax干啥呢,不嫌累啊?
[Quote=引用 19 楼 的回复:]
孟老师,已经解决了哈。我是这样做的,点击一次按钮就ajax请求服务端,然后把内容全部输出到iframe的dom内,接着再把样式文件和脚本文件输出到dom,就行了,谢谢了
引用 18 楼 的回复:
点击按钮之后,使用ajax请求服务端
改成
点击按钮之后,window.frames['ifrmaeName'].location='xx.aspx'
[/Quote]
grady.lu 2012-06-21
  • 打赏
  • 举报
回复
Please see the sample below:
jQuery.getScript("yourscript.js", function(){
alert('loading finished.');
});
fyg0072 2012-06-21
  • 打赏
  • 举报
回复
[Quote=引用 31 楼 的回复:]

哎 我说了 不可以的 你用详细的实例去测试嘛
引用 30 楼 的回复:

用Jquery可以的。

<script type="text/javascript" src='jquery-1.7.1.min.js'></script>
<script type="text/javascript">
$(function(){
$("div").html('<script' ……
[/Quote]

测试过, 可以。
代码小天王 2012-06-21
  • 打赏
  • 举报
回复
哎 我说了 不可以的 你用详细的实例去测试嘛
[Quote=引用 30 楼 的回复:]

用Jquery可以的。

<script type="text/javascript" src='jquery-1.7.1.min.js'></script>
<script type="text/javascript">
$(function(){
$("div").html('<script' + ' type="text/javascript">alert(1);</' + 's……
[/Quote]
fyg0072 2012-06-21
  • 打赏
  • 举报
回复
用Jquery可以的。

<script type="text/javascript" src='jquery-1.7.1.min.js'></script>
<script type="text/javascript">
$(function(){
$("div").html('<script' + ' type="text/javascript">alert(1);</' + 'script>');
});
</script>
<div></div>
代码小天王 2012-06-21
  • 打赏
  • 举报
回复
我肯定测试过仨 你自己可以测试下
[Quote=引用 28 楼 的回复:]

你返回的js有脚本错误,检查一下吧
还有无论是用innerHTML或者是jQuery("#xxx").html()里面有脚本是没问题的,脚本肯定会执行
[/Quote]
陈雪松 2012-06-21
  • 打赏
  • 举报
回复
你返回的js有脚本错误,检查一下吧
还有无论是用innerHTML或者是jQuery("#xxx").html()里面有脚本是没问题的,脚本肯定会执行
加载更多回复(26)

62,040

社区成员

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧