0

リスト ビューを使用した Jquery モバイル フォームの形式は次のとおりです。

<div data-role="page" id="arealistpage">

  <div data-role="header" data-theme="b">
        <h1>Area</h1>
        <a href="../MenuePages/Dictionaries.aspx" class='ui-btn-left ui-btn-back' data-icon='arrow-l' rel="external">Back</a>   <!-- your button to go back to index.php#user page -->
   <a href="AddArea.aspx" data-role="button" data-icon="plus" data-theme="d" style="float:left;"  rel="external" data-transition="slide">Add</a>
    </div><!-- /header -->

    <div data-role="content">  
    <ul data-role="listview" data-inset="true" data-theme="c"  data-filter="true" id="areaList" data-split-icon="gear" data-split-theme="d">
  <li><a href="#dialog?AreaNo=1" data-rel="dialog" data-transition="pop">Test</a><a class="deleteMe"></a></li>
    </ul>

    </div><!-- /content -->

     <div data-role="footer" data-theme="b" data-position="fixed">

            <div data-role="navbar">
            <ul>

               <li><a href="" data-role="tab" data-icon="arrow-u" class="returnTopAction">Top</a></li>
            </ul>
        </div>
    </div>


        <!-- /content -->

</div><!-- /page -->
<div data-role="page" id="dialog">
  <div data-role="header" data-theme="b">
    <h1>Options</h1>
  </div>   

 <ul data-role="listview" data-inset="false"
                data-theme="c">
               <%-- <li data-role="divider" data-theme="a">Options</li>--%>
                <li data-icon="false"><a>Edit</a></li>
                <li data-icon="false"><a>Delete</a></li>
                <li data-icon="false"><a>...</a></li>
            </ul>   
</div> 

リストビューの行クリックで「ダイアログ」divをダイアログとして開き、ダイアログからurlパラメータを読み取る必要があります。URLからAreaNoパラメータを取得する必要があります

  • タグを付けて、[開く] ダイアログで [URL を編集] に渡します。現在、ダイアログを開くことができず、機能していません。助けてください、悪い英語でごめんなさい

  • 4

    1 に答える 1

    1

    以下のようにあなたのhtmlを変更しました

    <div data-role="page" id="arealistpage">
        <div data-role="header" data-theme="b">
             <h1>Area</h1>
     <a href="../MenuePages/Dictionaries.aspx" class='ui-btn-left ui-btn-back'
            data-icon='arrow-l' rel="external">Back</a> 
            <!-- your button to go back
            to index.php#user page --> <a href="AddArea.aspx" data-role="button" data-icon="plus" data-theme="d"
            style="float:left;" rel="external" data-transition="slide">Add</a>
    
        </div>
        <!-- /header -->
        <div data-role="content">
            <div id="primaryList">
                <ul data-role="listview" data-inset="true" data-theme="c" data-filter="true"
                id="areaList" data-split-icon="gear" data-split-theme="d" id='dialogListView'>
                    <li><a href="#dialog" data-rel="dialog" data-transition="pop" data-areano="1">Test</a>
    
                        <a
                        class="deleteMe"></a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- /content -->
        <div data-role="footer" data-theme="b" data-position="fixed">
            <div data-role="navbar">
                <ul>
                    <li><a href="" data-role="tab" data-icon="arrow-u" class="returnTopAction">Top</a>
    
                    </li>
                </ul>
            </div>
        </div>
        <!-- /content -->
    </div>
    <!-- Dialog Page -->
    <div data-role="page" id="dialog">
        <div data-role="header" data-theme="b">
             <h1>Options</h1>
    
        </div>
        <div data-role="content">
            <ul data-role="listview" data-inset="false" data-theme="c">
                <!-- <li data-role="divider" data-theme="a">Options</li>-->
                <li data-icon="false"><a>Edit</a>
    
                </li>
                <li data-icon="false"><a>Delete</a>
    
                </li>
                <li data-icon="false"><a>...</a>
    
                </li>
            </ul>
        </div>
    </div>
    

    以下のようにリストのクリックイベントを追加しました

    $('div[id="primaryList"] ul[data-role="listview"] a').live("click", function () {
        var areaNo = $(this).data("areano");
        sessionStorage.areaNo = areaNo;
        alert("area no : " + sessionStorage.areaNo);
    });
    

    セッション ストレージ変数を使用して、アプリケーション全体で市外局番にアクセスできるようになりましたsessionStorage.areaNosessionStorageの詳細については、こちらをご覧ください。

    ここに実用的なフィドルがありますhttp://jsfiddle.net/9CctZ/7/

    于 2013-03-05T06:03:30.780 に答える