200分Jquery AJAX 输出HTML JS失效

子夜__ 2010-07-17 01:10:47

我现在想用Jquery AJAX 在Frame中输出一个HTML，这个HTML中包括CSS和JS等文件
代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>



    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>Insert title here</title>

    <script src="js/jquery.js" type="text/javascript"></script>



    <script type="text/javascript"><!--

        function clickDetails() {

            var strUrl = "HTMLPage.htm";

            var loadHtml = "<div style='margin: 60px auto; width: 500px;  text-align: center;'><span style='padding-top:15px; text-align:right; color:#9b9b9b;font-size:12px;'>" +

            "<img alt='load' src='script/jstree/themes/ajax-loader.gif' align='absMiddle'  bold='0'  /></span></div> ";

            $.getScript("js/JSTest.js"); 

            $.ajax({

                type: "get",

                url: strUrl,

                data: "",

                dataType: "html",

                beforeSend: function() {

                    window.frames['rightFrame'].document.body.innerHTML = loadHtml;

                   

                },

                success: function(msg) {



                    window.frames['rightFrame'].document.body.innerHTML = msg;

                    //alert(msg);

                    //document.getElementById("rightFrame").src=strUrl;



                }

            });

            



        }



// --></script>







</head>

<body>

    <input type="button" id="send" value="弹出页面" onclick="clickDetails()" />

    <div id="resText">

    </div>

    <iframe frameborder="0" id="rightFrame" name="rightFrame" style="width: 100%; border: 1px;

        border-color: Red;" width="200px" height="700px"></iframe>

        

        

</body>

</html>

但是我加载出的页面中JS失效。

我想了下第一种是不是在输出之前没有解析JS呢？
但是我弹出一下页面信息发现源文件中的JS已经加载上了
但是按钮调用JS方法失效。

第二种是不是输出之后就没办法调用JS了呢？

具体的机制不是很了解。写了些代码还是有问题。

...全文

1501 12 打赏收藏转发到动态举报

写回复

用AI写文章

12 条回复

切换为时间正序

请发表友善的回复…

发表回复

子夜__ 2010-07-17

打赏
举报

window.frames['rightFrame'].document.write(msg);

搞定还是没写进去

mars199 2010-07-17

打赏
举报

[Quote=引用 9 楼 ff1222 的回复:]
我猜，只要把结果中"</script>"，替换成"<\/script>"就可以了，当然只是猜测
[/Quote]我也这样猜

bychgh 2010-07-17

打赏
举报

帮顶~~~~~~~~~~

ff1222 2010-07-17

打赏
举报

我猜，只要把结果中"</script>"，替换成"<\/script>"就可以了，当然只是猜测

子夜__ 2010-07-17

打赏
举报

如何改下这句话window.frames['rightFrame'].document.body.innerHTML = loadHtml;
把loadHtml的内容写进去？
或者有其他什么好的方案？

子夜__ 2010-07-17

打赏
举报

文件解析了之后。就是没有输出到指定的iframe里。所以才才找不到JS。

子夜__ 2010-07-17

打赏
举报

不知道是不是这个原因。
我输出的页面只有
<HTML></HTML> 这两个代码
难道是他只是输出了并没有把源文件绑到frame里？

怎么才能把源文件里的HTML绑定到frame里呢绑定后他那个方法才能找到地址来访问那个函数。

lester19872007 2010-07-17

打赏
举报

\" 反斜杠就是转义输出"

lester19872007 2010-07-17

打赏
举报



var deleteReply = function() {

    var div = "<div id=\"Popup\" style=\"display:none;\"></div>"

    window.CloseFlag = $(div).modal();

    var content = "<table>\

                              <tr><td>您确定要删除吗？</td></tr>\

                              <tr>\

                                 <td>\

                                     <input type=\"button\" value=\"确定\" id=\"btnConfirm\" values=" + $(this).attr("values") + " />\

                                     <input type=\"button\" value=\"取消\" id=\"btnCannel\" />\

                                 </td>\

                              </tr>\

                            </table>";

    var popup = $("#Popup").html(content);

    popup.find("#btnConfirm").click(function() {

        $.jmsajax({

            url: window.ArticleReplyService,

            method: "DeleteArticleReply",

            data: {

                articleReplyId: $(this).attr("values")

            },

            success: function(data) {

                if (data == true) {

                    UPDATEREPLYCOUNT(window.ArticleId, "delete");

                    LoadData();

                    $("#Popup").text("删除成功");



                }

                else {

                    $("#Popup").text("删除失败");

                }

                setTimeout("window.CloseFlag.close()", 1500);

            }

        });

    });

    popup.find("#btnCannel").click(function() {

        window.CloseFlag.close();

    });



}

你这个其实就是一个funcation 完全没有必要去用调用接口的方式来做！

子夜__ 2010-07-17

打赏
举报

[Quote=引用 2 楼 sandy945 的回复:]

你为什么不直接设置 iframe 的 src ='HTMLPage.htm'
[/Quote]

做个练习需求就是这样子的。想用这种方法来输出HTML 但是输出的JS 失效。

阿非 2010-07-17

打赏
举报

你为什么不直接设置 iframe 的 src ='HTMLPage.htm'

lester19872007 2010-07-17

打赏
举报

$(function() {

    $("#addForumBtn").bind("click", function() {

        var html = "<table  style=\"width:100%; text-align:left;\">";

        var div = "<div id=\"Popup\" style=\"display:none;width:100%\"></div>"

        window.CloseFlag = $(div).modal();

        $.jmsajax({

            url: window.ForumService,

            method: "GetTopicForum",

            data: {},

            success: function(data) {

                var list = data["TopicForumList"];

                var count = data["Count"];

                var cols = 4 - count % 4 + 1;

                var flag = 0;

                if (count > 0) {

                    $.each(list, function(i, n) {

                        flag = i + 1;

                        if (flag % 4 == 1) {

                            html += "<tr>"

                        }

                        html += "<td ";

                        if (flag == count && cols > 0) {

                            html += "colspan='" + cols + "'";

                        }

                        html += "><input type=\"radio\" name=\"n\" id=\"" + list[i]["TopicId"] + "\" values=\"" + list[i]["TopicId"] + "\"  /><label for=\"" + list[i]["TopicId"] + "\">" + list[i]["TopicName"] + "</label></td>"

                        if (flag % 4 == 0 || flag == count) {

                            html += "</tr>"

                        }

                    });

                    html += "<tr><td colspan='4' style=\"text-align:right;\"><input type='button' value='下一步' id='next'/></td></tr></table>";

                    $("#Popup").html(html);

                    $("#Popup").find("#next").click(function() {

                        var values = $("#Popup").find("input:checked").attr("values");

                        html = "<table  style=\"width:100%; text-align:left;\">";

                        $("#Popup").html("");

                        $.jmsajax({

                            url: window.ForumService,

                            method: "GetForum",

                            data: {

                                topicId: values

                            },

                            success: function(data) {

                                list = data["ForumList"];

                                count = data["Count"];

                                cols = count % 4 == 0 ? 1 : 4 - count % 4 + 1;

                                flag = 0;

                                if (count > 0) {

                                    $.each(list, function(i, n) {

                                        flag = i + 1;

                                        if (flag % 4 == 1) {

                                            html += "<tr>"

                                        }

                                        html += "<td ";

                                        if (flag == count && cols > 1) {

                                            html += "colspan='" + cols + "'";

                                        }

                                        html += "><input type=\"checkbox\" name=\"n\" id=\"" + list[i]["ThemeId"] + "\" values=\"" + list[i]["TopicId"] + "\" ThemeId=\"" + list[i]["ThemeId"] + "\" ForumId=\"" + list[i]["ForumId"] + "\"  /><label for=\"" + list[i]["ThemeId"] + "\">" + list[i]["TopicName"] + "</label></td>"

                                        if (flag % 4 == 0 || flag == count) {

                                            html += "</tr>"

                                        }

                                    });

                                    html += "<tr><td colspan='4' style=\"text-align:right;\"><input type='button' value='定 制' id='btnCustomize'/></td></tr></table>";

                                    $("#Popup").html(html);

                                    $("#Popup").find("#btnCustomize").click(function() {

                                        $("#Popup").html("定制成功");

                                        setTimeout("window.CloseFlag.close()", 2000);

                                    });

                                }

                            }

                        });

                    })

                }

            }

        });

    });



})