0

phonegap の助けを借りて 1 つの Android アプリを作成しています。

トグルスイッチがオフの場合、3 ページ目の画像は非表示になり、トグルスイッチがオンの場合は画像が表示されます

どうすればいいのか教えてください

HTML5 の場合:-

    <div data-role="page" id="page1">
    <div data-role="content">
        <select name="toggleswitch1" id="toggleswitch1" data-theme="" data-role="slider">
            <option value="off">Off</option>
            <option value="on">On</option>
        </select>
        <a data-role="button" id="button1" data-inline="true" href="#" onclick="clickfn();">Button</a>
    </div>


  <div data-role="page" id="page2">
    <div data-role="content">
         <p>some text</p><p>some text</p>
        <a data-role="button" id="button2" data-inline="true" href="#page3" >Button</a>
    </div>


<div data-role="page" id="page3">
    <div data-role="content">
        <p>some text</p><p>some text</p>
        <img src="xyz image" />
                  <a data-role="button" id="button3" data-inline="true" href="#page1" >Button</a>
    </div>

jquery:-

  $(document).unbind('pageinit').bind('pageinit', function () {
          clickfn(); 
        });


    function clickfn(){
       $('#button1').click(function(){
                  if($("#toggleswitch1 option:selected").val() == 'off'){
                  $.mobile.changePage("#page2");
                  }else{
                  $.mobile.changePage("#page2");
                  }
                });
    }
4

2 に答える 2

0

あなたのimgにIDを追加してください

  <img id="myimg" src="xyz image" />

そして、コードの可視性を切り替えます

function clickfn(){
       $('#button1').click(function(){
                  if($("#toggleswitch1 option:selected").val() == 'off'){
                      $("#myimg").hide ();
                  }else{
                      $("#myimg").show ();
                  }
                });

}

于 2013-08-29T11:51:16.857 に答える