Jquery函数在web浏览器上工作但在android设备上没有

时间:2013-09-20 12:53:39

标签: jquery jquery-mobile cordova

我有一个Phonegap应用程序,它不会加载一些JQuery和Mobiscroll脚本。在浏览器中加载完美,但是当我使用phonegap构建它并在设备上测试时,它不会向我显示数据和时间滚动条以及添加一些jSON的按钮。

我是网络应用程序构建和使用phonegap的新手,所以如果我犯了一个菜鸟错误,请不要狠狠地对我说。

我还尝试了Phonegap not calling device ready function的ElLocoCocoLoco解决方案,得到了相同的结果。我认为它与$(document).ready(function($)有关,因为当我删除函数参数中的“$”时它也不会在web浏览器中加载

脚本如下

$(document).ready(function($) {
    var json = '[{"productsArray":[{"productName":"Wine","productPrice":"12 ","priceCurrency":"Dollar      ","productDescription":"   Very good   "}],"categoryName":"Drinks"},{"productsArray":[{"productName":"Steak","productPrice":"12 ","priceCurrency":"Dollar      ","productDescription":"   This is a very short description   "},{"productName":"Garlic","productPrice":"2 ","priceCurrency":"Dollar      ","productDescription":"   Dracula   "}],"categoryName":"Very good food"}]';
    var obj = JSON && JSON.parse(json) || jQuery.parseJSON(json);



    $('#addCategory').click(function () {
    for (var j = 0; j < obj.length ;j ++) { 
    var categoryHTML='<div data-role="collapsible" data-collapsed="true"><h2>'+ obj[j].categoryName +'</h2><ul data-role="listview" data-split-icon="plus" data-theme="a" data-split-theme="b" data-inset="true"  >';
    for (var i = 0; i < obj[j].productsArray.length ;i++) { 
        categoryHTML += ('<li>  <a href="#" onclick="showMe(\'cat-ex\')"> <h3>'+ obj[j].productsArray[i].productName +'</h3> \
                          <p><strong> '+ obj[j].productsArray[i].productDescription +'</strong> </p>\
                          <span class="ui-li-count"><strong>'+ obj[j].productsArray[i].productPrice +'</strong>LEI</span>   \
                          </a><a href="#" style="margin-top:0px;" onClick="alert(\'Comanda a fost plasata!\')" data-rel="popup" data-transition="pop">Plateste</a><br></li>');
    }
    categoryHTML += '</ul></div>';

    $('#menuHolder').append(categoryHTML).trigger("create");
    $('#menuHolder').find('div[data-role=collapsible]').collapsible();}
    });

        $('#demo').mobiscroll().date({
            theme: 'android-ics light',
            display: 'bottom',
            mode: 'scroller',
            onFocus: false,
            onTouch: true,
            invalid: [ 'w0', 'w6', '5/1', '12/24', '12/25' ]

        });    
        $('#show').click(function(){
            $('#demo').mobiscroll('show'); 
            return false;
        });


        $('#demo2').mobiscroll().time({
            theme: 'android-ics light',
            display: 'inline',

            mode: 'scroller',
            stepMinute: 15,
            headerText: false
        });    
        $('#show2').click(function(){
            $('#demo2').mobiscroll('show'); 
            return false;
        });


        $('#demo3').mobiscroll().select({
            theme: 'android-ics light',
            display: 'modal',
            animate: 'pop',
            mode: 'scroller',
            inputClass: 'i-txt',
            width: 200
        });
        $('#show3').click(function () {
            $('#demo3').mobiscroll('show'); 
            return false;
        });
        $('#clear').click(function () {
            $('#demo').val('');
            $('#demo2').val('');
            $('#demo3').val(1).change();
            $('#demo3'+'_dummy').val('');
            return false;
        });

        $('#demo').focus(function() {
            this.blur();
        });
        $('#demo2').focus(function() {
            this.blur();
        });
        $('#demo3').focus(function() {
            this.blur();
        });     
});

1 个答案:

答案 0 :(得分:2)

通过使用

更改init来使其工作
jQuery(document).on('pageinit','#imenu', function () {

点击功能

jQuery('#addCategory').live('tap', function () {

所有选择器 $ jQuery ,因为我与另一个框架存在冲突,现在它在我的设备上完美运行