Ajax动态加载脚本+HTML
比如:通过Ajax从服务器获得个xml
生成XML的页面:
<respone> <?php echo '<code>code abc</code>'; echo '<message>You had requested a test.</message>'; echo '<view><button id="lala">This prase as html.</button></view>'; echo '<script_src><script>$("#lala").click(mess);function mess(){alert("Script loaded.");}</script></script_src>'; ?> </respone>
然后想在前端处理这些返回,插入view的内容作为HTML啊,script添加些函数,做下事件的绑定之类的。
Ajax回调
function handleSuccess(data){ var message=$(data).find("message"); var code=$(data).find("code"); var view=$(data).find('view'); var script_src=$(data).find('script_src'); $("#div_code").empty(); $("#div_code").append(code.text()); $("#div_message").empty(); $("#div_message").append(message.text()); var button='<button id="lala">'+view.text()+"<" + "/button>"; $("#div_view").empty(); $("#div_script").append(button); var some='<script>'+script_src.text()+"<" + "/script>"; $('#div_script').append(some); }
问题是,如果不做类似"<" + "/script>"的事,HTML 和 脚本 的部分就不能正常工作。这是为什么?是否可以解决这问题?
然后就是即便像上面这样做了,$("#lala").click(mess);这段对同时插入的HTML tag的事件绑定也没生效,但是如果是对页面原有的HTML作为对象绑定的话,就能正常工作。
找到答案了。
xml内容改成这样,
echo '<script_src><![CDATA[<script>$("#lala").click(mess);function mess(){alert("Script loaded.");}</script>]]></script_src>';
用CDATA让jquery解析时跳过内容,避免把HTML的tag解析成XML,
然后在JS中就可以
var script_src=$(data).find('script_src'); $('#div_script').append(script_src.text());