0

我尝试使用 kendoUI mobile 为移动设备制作一些网页。在 Android 和 IOS 上它可以正常工作，但后来我在 WP8 上尝试过，一切都坏了。直到现在我才能发现问题所以希望有人可以帮助我并告诉我错误在哪里.. 代码：

<div data-role="drawer" id="my-drawer" style="width: 96%;" data-views="['start']">
    <ul data-role="listview" data-type="group">
        <li>
            <ul>
               <li data-icon="" onclick="colorThis(this)" style="cursor:pointer">One</li>
               <li data-icon="" onclick="colorThis(this)" style="cursor:pointer">Two</li>
               <li data-icon="" onclick="colorThis(this)" style="cursor:pointer">Three</li>
               <li data-icon="" onclick="colorThis(this)" style="cursor:pointer">Four</li>
               <li data-icon="" onclick="colorThis(this)" style="cursor:pointer">Five</li>
            </ul>
        </li>
        <li>
            <ul>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Six</li>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Seven</li>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Eight</li>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Nine</li>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Ten</li>
               <li data-icon="" style="cursor:pointer" id ="" onclick="colorThis(this)">Eleven</li>
            </ul>
        </li>
    </ul>
</div>
<div data-role="layout" data-id="drawer-layout">
    <div data-role="header">
        <div data-role="navbar">
            <a data-role="button" data-rel="drawer" href="#my-drawer" data-icon="search" data-align="left"></a>
            <span data-role="view-title"></span>
            <a data-align="right" data-role="button" class="nav-button" data-rel="external" data-icon="home" href="home.aspx"></a>
        </div>
    </div>
</div>
<div id = "start" runat="server" data-title="Aufgaben" data-role="view" data-layout="drawer-layout" style="">
        <div id="maindiv" data-role="page" style="display:block; text-align:center; height:100%" >
            <asp:Label runat="server" ID ="lbl_editorInfo" Text=""></asp:Label><br /><br />
            <asp:Label runat="server" ID ="lbl_taskStatus" Text="success"></asp:Label>
            <div style="width:99%"><input type="text" ID="search_txt" runat="server" class="km-text full" /></div><br />
            <ul id="taskList" style="width:99%"></ul>
        </div>
        <script type="text/x-kendo-tmpl" id="template">
            <div id="div_templ" style="cursor: pointer;" onclick="" >
                <div style="overflow:hidden; margin-top:5px; text-overflow:ellipsis; ">
                    <span class="" style="width:25%"></span><span class="" style="" title=""></span>
                </div>
                <div style="overflow:hidden; margin-top:2px; text-overflow:ellipsis;" >
                    <span class="" style="width:25%"></span><span class="" style="" title=""></span>
                </div>
            </div>
            <div style="clear:both" ></div>
        </script>

        <script type="text/javascript">
            var dataSource = new kendo.data.DataSource({
                transport:
            {
                read:
                {
                    url: url,
                    contentType: "application/json; charset=utf-8",
                    type: "GET",
                    dataType: "json"
                }
            },
                schema:
            {
                data: 'GetDATAResult.RootResults',
                total: 'GetDATAResult.TotalCount'
            },
                pageSize: 10,
                serverPaging: true
            });

            function checkTheBox(chkBoxID) {
                var theBox = document.getElementById(chkBoxID);
                if (theBox.checked) {
                    theBox.checked = false;
                }
                else {
                    theBox.checked = true;
                }
                colorThis(theBox);
            }

            function colorThis(t) {
                if (!($(t).hasClass("background_orange"))) {
                    $(t).addClass("background_orange");
                }
                else {
                    $(t).removeClass("background_orange");
                }
            }

            $("#taskList").kendoMobileListView({
                dataSource: dataSource,
                template: $("#template").text()

            });

            var app = new kendo.mobile.Application($(document.body),
            {
                loading: "<h1>Loading...</h1>"
            });
        </script>

在 WP 上只有纯 html，没有来自 kendoUI 的样式或 javascript。

问候，蒂姆

4

1 回答 1

0

我面临同样的问题。你能找到什么吗？

初步调查，WP8 中的 IE 浏览器似乎主动阻止了它收到的回调。可以在此处找到有关此行为的一些信息：http: //blogs.msdn.com/b/ieinternals/archive/2010/09/27/ie9-beta-google-image-search-javascript-content-type-and- nosniff.aspx

此外，如果您创建数据源的 JSBin，您可以在 IE 浏览器开发工具窗口 -> 控制台中检查错误：由于 mime 类型不匹配而阻止了来自的脚本

抱歉，我仍然没有任何解决方案。我刚刚分享了一些发现。

于 2013-09-20T15:31:26.307 回答