0

我正在使用 jQuery Mobile(连同 jQuery)来创建一个移动网站。这不是使用 jQuery Windows Phone UI。

我创建了两个选择框,“ bpSelect ”和“ msSelect ”。msSelect 的数据基于 bpSelect 中的选择。

一旦用户在 bpSelect 中做出选择,就会对后端数据库进行 ajax 调用,然后将数据以 JSON 格式传回页面。创建 msSelect 的选项并调用“刷新”来显示它。

在任何桌面网络浏览器以及 iPhone 或 Android 设备上都可以正常工作。 在我的 WINdows Phone (Lumia 920) 上,永远不会创建 msSelect 框。

当我进行选择时,Windows Phone 似乎没有在页面上调用 $('#bpSelect').change(function() 。当我在此调用中放置“警报”时,它会在每个设备上触发,但Windows Phone 8 浏览器。

这里有什么想法吗?我尝试了很多方法,例如使用“data-ajax = false”来访问页面,以及使用“document.ready()”而不是“pageinit”,但似乎没有任何效果。Windows Phone 浏览器似乎忽略了某些 jQuery 代码。

我所有的函数都在页面顶部的 $('#createCarPage').bind('pageinit', function() 内。它位于data-role="page" data-theme="a" id=" createCarPage" DIV 标记

Windows Phone 似乎忽略了其他几件事,例如.selectmenu('disable') ,但现在我只是想让选择框工作。

我的代码的基础知识如下。任何帮助,将不胜感激。我真的被这个难住了。

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

<body>
<div data-role="page" data-theme="a" id="createCarPage" class="rf-background">

<script type="text/javascript">

$('#createCarPage').bind('pageinit', function()
{
    $("#exTypeOptions input[type='radio']").checkboxradio('disable');

    $('#bpSelect').selectmenu('disable');
    $('#msSelect').selectmenu('disable');

    $('#bpSelect').on('change', function ()
    {
         $("#msSelect option").each(function(index, option) {
                 $(option).remove();
             });

        var listServlet = "/messages/makeList"; 

         $.ajax({
                   url: listServlet,
                   data: { bp:$('#bpSelect').val() },
                   dataType: "json",
                   success: function(data)
                   { 
                      $('#msSelect').append('<option value=>' + 'Select...'+ '</option>');

                    for (var i=0; i<data.model.length; i++)
                      {
                        $('#msSelect').append('<option value="' + data.model[i] + '">' + data.model[i]+ '</option>');
               }

                        $('#msSelect').selectmenu('enable');
                $('#msSelect').selectmenu('refresh');

                   },
                   error: function(jqXHR, textStatus, errorThrown)
                   {

                   }

                 });     

        });

      }); 

</script>
4

1 回答 1

1

好的,我想通了。在研究了 jQuery 和 jQuery Mobile 之后,我看不出为什么浏览器会忽略 jQuery 代码。jQuery 网站声明它支持 Windows Phone 浏览器,所以肯定还有另一个问题。

有... Zepto.js

除了使用 jQuery,我还使用了响应式框架Foundation 4。我发现 Foundation 使用 Zepto.js 而不是 jQuery。Zepto.js 网站声明如下...

Zepto 有望在除 Internet Explorer 之外的所有现代浏览器和类似浏览器的环境中工作。

Foundation 网站说你可以毫无问题地将 jQuery 替换为 Zepto。当我删除对 Zepto 的引用时...问题解决了。

Foundation 表示他们转而使用 Zepto 作为 jQuery 的“更轻量级的替代品”。

就个人而言,我将采取更重的实际工作!

我希望这可以帮助别人。

于 2013-11-13T20:30:56.740 回答