JavaScript Telerik如果更换

使用teleriks拖放演示，我能够重现功能，但是，我想做的是，如果浏览器不兼容HTML5，我想加载一个不同的功能。下面是我正在使用的代码

<script type="text/javascript">
    var $ = $telerik.$;
    function pageLoad() {
        if (!Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {
            $(".wrapper").replaceWith(
                $("<span><strong>Your browser does not support Drag and Drop. Please take a look at the info box for additional information.</strong></span>"));
        }
    }

    function added(sender, args) {
        if (Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {

            $(".ruDropZone").html("<div align=\"center\"><img src=\"images/logo.png\" width = \"300\"></div>");
        }
    }

</script>

如何在.replaceWith中包含以下内容

<telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" OnClientAdded="added" OnFileUploaded="RadAsyncUpload1_FileUploaded">
    </telerik:RadAsyncUpload>
    <br />
    <telerik:RadProgressManager ID="Radprogressmanager1" runat="server" />

    <div style="position:relative;">
        <table>
            <tr>
                <td id="controlContainer">
                    <telerik:RadUpload
                        ID="RadUpload1" runat="server"
                        MaxFileInputsCount="5"
                        OverwriteExistingFiles="false" />

                    <telerik:RadProgressArea id="progressArea1" runat="server"/>

                    <asp:Button id="buttonSubmit" runat="server" CssClass="RadUploadSubmit" OnClick="buttonSubmit_Click" text="Submit" />
                </td>
                <td>
                    <div class="smallModule">
                        <div class="rc1"><div class="rc2"><div class="rc3" style="width:240px">

                            <asp:Label ID="labelNoResults" runat="server" Visible="True">No uploaded files yet</asp:Label>

                            <asp:Repeater ID="repeaterResults" runat="server" Visible="False">
                                <HeaderTemplate>
                                    <div class="title">Uploaded files in the target folder:</div>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <%#DataBinder.Eval(Container.DataItem, "FileName")%>
                                    <%#DataBinder.Eval(Container.DataItem, "ContentLength").ToString() + " bytes"%>
                                    <br />
                                </ItemTemplate>
                            </asp:Repeater>
                        </div></div></div></div>
                            </td>
                            </tr>                              
                            </table>
                            </div>
                            </div>

---

我就是这样做的，通过创建额外的div并基于div隐藏元素

<script type="text/javascript">
    var $ = $telerik.$;
    function pageLoad() {
        if (!Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {
            $(".wrapper").replaceWith(
            $("")); 
        }
    }

    function added(sender, args) {
        if (Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {

            $(".ruDropZone").html("<div align=\"center\"><img src=\"images/logo.png\" width = \"300\"></div>");
            $(".nonHTML5").replaceWith(
            $(""));
        }
    }

</script>

<div class="wrapper">

    <telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" OnClientAdded="added" OnFileUploaded="RadAsyncUpload1_FileUploaded">
    </telerik:RadAsyncUpload>
    <br />
    <telerik:RadProgressManager ID="Radprogressmanager1" runat="server" />
    </div>
    <div class ="nonHTML5" style="position:relative;">
        <table>
            <tr>
                <td id="controlContainer">
                    <telerik:RadUpload
                        ID="RadUpload1" runat="server"
                        MaxFileInputsCount="5"
                        OverwriteExistingFiles="false" />

                    <telerik:RadProgressArea id="progressArea1" runat="server"/>

                </td>
                <td>
                    <div class="smallModule">
                        <div class="rc1"><div class="rc2"><div class="rc3" style="width:240px">

                            <asp:Label ID="labelNoResults" runat="server" Visible="True">No uploaded files yet</asp:Label>

                            <asp:Repeater ID="repeaterResults" runat="server" Visible="False">
                                <HeaderTemplate>
                                    <div class="title">Uploaded files in the target folder:</div>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <%#DataBinder.Eval(Container.DataItem, "FileName")%>
                                    <%#DataBinder.Eval(Container.DataItem, "ContentLength").ToString() + " bytes"%>
                                    <br />
                                </ItemTemplate>
                            </asp:Repeater>
                        </div></div></div></div>
                            </td>
                            </tr>                              
                            </table>
                            </div>
                            <asp:Button id="buttonSubmit" runat="server" CssClass="RadUploadSubmit" OnClick="buttonSubmit_Click" text="Submit" />
                            </td>
                            </tr>

---

我以前从未这样做过，但我的想法只是理论上的。能否将该代码包装在div或ASP.NET System.Web.UI.WebControl.Panel对象中？。div标记将从Panel web控件以HTML格式呈现出来。找出那个div的id是什么，然后得到那个div的innerHTML。innerHTML就是用你的代码呈现出来的。嗯，刚刚尝试过，是的，这不起作用：你的评论帮助我找到答案，谢谢！很高兴我能帮上忙。。之前让我困惑的是，在问题的代码片段中，我没有看到id=wrapper的标记或名为wrapper的类。我假设它是使用一个id为wrapper的div完成的，这个div在您在google或参考资料中找到的代码示例中。因此，包装其他代码，然后替换包装器div中的内容。

<script type="text/javascript">
    var $ = $telerik.$;
    function pageLoad() {
        if (!Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {
            $(".wrapper").replaceWith(
            $("")); 
        }
    }

    function added(sender, args) {
        if (Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {

            $(".ruDropZone").html("<div align=\"center\"><img src=\"images/logo.png\" width = \"300\"></div>");
            $(".nonHTML5").replaceWith(
            $(""));
        }
    }

</script>

<div class="wrapper">

    <telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" OnClientAdded="added" OnFileUploaded="RadAsyncUpload1_FileUploaded">
    </telerik:RadAsyncUpload>
    <br />
    <telerik:RadProgressManager ID="Radprogressmanager1" runat="server" />
    </div>
    <div class ="nonHTML5" style="position:relative;">
        <table>
            <tr>
                <td id="controlContainer">
                    <telerik:RadUpload
                        ID="RadUpload1" runat="server"
                        MaxFileInputsCount="5"
                        OverwriteExistingFiles="false" />

                    <telerik:RadProgressArea id="progressArea1" runat="server"/>

                </td>
                <td>
                    <div class="smallModule">
                        <div class="rc1"><div class="rc2"><div class="rc3" style="width:240px">

                            <asp:Label ID="labelNoResults" runat="server" Visible="True">No uploaded files yet</asp:Label>

                            <asp:Repeater ID="repeaterResults" runat="server" Visible="False">
                                <HeaderTemplate>
                                    <div class="title">Uploaded files in the target folder:</div>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <%#DataBinder.Eval(Container.DataItem, "FileName")%>
                                    <%#DataBinder.Eval(Container.DataItem, "ContentLength").ToString() + " bytes"%>
                                    <br />
                                </ItemTemplate>
                            </asp:Repeater>
                        </div></div></div></div>
                            </td>
                            </tr>                              
                            </table>
                            </div>
                            <asp:Button id="buttonSubmit" runat="server" CssClass="RadUploadSubmit" OnClick="buttonSubmit_Click" text="Submit" />
                            </td>
                            </tr>