1

ハイブリッドモバイルアプリを作成していて、Webサービスからhtmlを取得した後にjQueryMobile-initializeメソッドを適用したいと思います。（「ハイブリッドモバイルアプリ」とは、htmlページから開始し、スタイル設定にjQueryMobileを使用することを意味します。 Webサービスへのajax呼び出しを使用して、ボタンのクリックなどに関するデータを取得します。最後に、すべてをネイティブアプリにフォールドします。）


したがって、（pseudo） $ .initWithJQueryMobile（$（'＃my_div_id'））のようなものがあるかどうかは誰にもわかりませ
ん。注：wsリクエスト/レスポンスを実行するときに、新しいdata-role=pageに移動しません。

背景：ご存知かもしれませんが、htmlファイルを初期化すると、jqmはこれを変更します

    <select id="116" data-role="slider" >
    <option value='no'>No</option>                               
    <option value='yes'>Yes</option></select>

これに ここに画像の説明を入力してください

Webサービスが戻った後（pagecreateイベントが発生してからずっと後）にこれを実行したいと思います。

フリップトグルをクリックまたはタップすると（彼らはそれを呼びます）、はいといいえの間で切り替わります。

このjqmを実現するには、スパン、div、スタイルを使用してdomを根本的に書き直し、フリップトグルのonclickにjavascriptメソッドを適用します。

私はpage-view-sourceからhtmlを盗むことができるので、誰かがそれを切り替えるjqm jsメソッドを知っていれば、そこからそれを取得することができます（私は知っています、大きなハック）。または …。使用できる$.initWithJQueryMobile（）関数はありますか？

4

2 に答える 2

1

jqm初期化したいタグは、<select>jqmがそれらをフリップトグルに変更します。jqm では with をマークアップして<select>いますdata-role='slider'

とにかく、ユーザーが郵便番号ボックスに5番目の数字を入力したことに応じて、一連の選択をロードしています。これが機能することがわかりました：

// get an array of the &lt;select>s you want to initialize
var endorsement_controls =  $('div#divEndorsements select');
endorsement_controls.each(function(){
    // the next two lines make them flip toggles
    $(this).slider();
    $(this).slider('refresh');
});

$.slider()彼らがウィジェットと呼んでいるものです。すべてではないにしても、ほとんどのコントロールにアナログがあると思います。

クレイグ・ブルックスからゲームを変えるヒントを得た

于 2013-01-30T22:27:41.783 に答える
0

まず、このトピックについて詳しく知りたい場合は、私のブログARTICLEをご覧ください。または、ここで見つけることができます。すべてのソリューションには、1 つ以上のjsFiddle例が付属しています。

マークアップ拡張jsFiddleを使用した $.ajax 呼び出しのかなり複雑な例を次に示します。

$('#index').live('pagebeforeshow',function(e,data){    
    $('#cars-data').empty();
    $.ajax({
        type: "POST",
        url: "/echo/xml/",
        dataType: "xml",
        data: {
            xml: "<cars><car><name>TOYOTA</name><country>JAPAN</country><pic>http://1call.ms/Websites/schwartz2012/images/toyota-rav4.jpg</pic><description>Toyota has announced that it will recall a total of 778,000 units that may have been manufactured with improperly-tightened nuts on the rear suspension.</description></car></cars>"
        },
        success: function(xml) {
            ajax.parseXML(xml);
        },
        error: function (request,error) {
            alert('Network error has occurred!');
        }
    });
});

$("#cars").live('pagebeforeshow', function () {
    $("#cars div[data-role='header'] h1").html(carObject.carName);
    $('#car-data').empty();
    $('#car-data').append('<li>Car Type:<span> ' + carObject.carName + '</span></li>');
    $('#car-data').append('<li>Car Country:<span> ' + carObject.carCountry + '</span></li>');        
    $('#car-data').append('<li>Car Description:<span> ' + carObject.description + '</span></li>');    
    $('#car-data').listview('refresh');   
    $('#car-img').attr('src' , carObject.img );    

});

var ajax = {  
    parseXML:function(result){
        $(result).find("car").each(function()
        {
            carObject.carName  = $(this).find('name').text();
            carObject.carCountry  = $(this).find('country').text();
            carObject.img  = $(this).find('pic').text();
            carObject.description  = $(this).find('description').text();

            $('#cars-data').append('<li><a href="#cars"><img src="' + carObject.img + '" title="sample" height="100%" width="100%"/><h3>Car type:<span> '+carObject.carName+'</span></h3><p>' + carObject.description + '</p></a></li>');
        });    
        $('#cars-data').listview('refresh');
        $('#index').append('<div data-role="footer" data-position="fixed"><h1>Dynamicaly added footer</h1></div> ');
        $('#index [data-role="content"]').append('<fieldset data-role="controlgroup"><legend>Choose:</legend><input type="radio" name="radio" id="radio1" value="1" checked="checked" /><label for="radio1">option 1</label></fieldset>');
        $('#index').trigger('pagecreate');
    }
}

var carObject = {
    carName : '',
    carCountry : '',
    img : '',
    description : ''    
}
于 2013-01-29T17:12:07.843 に答える