0

次のダイアログ定義があります。

<div data-role="dialog" id="operator-delete" data-theme="b" data-title="Delete record">

    <div data-role="header" data-theme="b">
        <h2>Confirm deletion</h2>
    </div>

    <div data-role="content">
        <p><div id="delete-confirm">Do you really want to delete record?</div></p> 
        <table border="0" cellspacing="30" width=100%>
            <tr>
                <td valign="center" halign="left"><a href="#" id="delete-cancel" data-role="button" data-inline="true" data-theme="b" data-rel="back" data-icon="arrow-l">No</a></td>
                <td valign="center" halign="right"><a href="#" id="delete-confirm" data-role="button" data-inline="true" data-theme="b" data-icon="delete">Yes</a></td>
            </tr>
        </table>
    </div> <!-- /content -->
</div> <!-- /dialog -->

jQuery ボタンによって呼び出されるこのダイアログ:

<a href="#operator-delete" data-rel="dialog" data-transition="pop" 
id="delete-user" data-role="button" data-inline="true" data-theme="b" data-icon="delete" class="ui-btn-right">Delete</a>

必要に応じてダイアログが表示されますが、ダイアログ ヘッダーの [いいえ] ボタンと閉じるボタンに反応しません。一方、jQuery doc は次のように述べています。「ダイアログ内でリンクがクリックされると、フレームワークは自動的にダイアログを閉じます (!!!)...」。jQuery サンプル ソースを見ましたが、サンプル ダイアログを閉じるための追加の努力はしていません。どうしたの?

4

1 に答える 1

1

コードを実装しましたが、ダイアログを閉じる際に問題はありませんでした。フィドルを確認してください。HTML 構造に問題があるように感じます。

<div data-role="page">
    <div data-role="content">
            <a href="#operator-delete" data-rel="dialog" data-transition="pop" 
id="delete-user" data-role="button" data-inline="true" data-theme="b" data-icon="delete" class="ui-btn-right">Delete</a>
    </div>
</div>

<div data-role="dialog" id="operator-delete" data-theme="b" data-title="Delete record">
    <div data-role="header" data-theme="b">
         <h2>Confirm deletion</h2>

    </div>
    <div data-role="content">
        <p>
            <div id="delete-confirm">Do you really want to delete record?</div>
        </p>
        <table border="0" cellspacing="30" width=100%>
            <tr>
                <td valign="center" halign="left"><a href="#" id="delete-cancel" data-role="button" data-inline="true" data-theme="b" data-rel="back" data-icon="arrow-l">No</a>
                </td>
                <td valign="center" halign="right"><a href="#" id="delete-confirm" data-role="button" data-inline="true" data-theme="b" data-icon="delete">Yes</a>
                </td>
            </tr>
        </table>
    </div>
    <!-- /content -->
</div>
<!-- /dialog -->

http://jsfiddle.net/maheshsapkal/aeWAE/

于 2013-04-18T15:36:15.677 に答える