2

私は、いくつかのボタンとポップアップを備えた小さな jquery モバイル webapp で忙しいです。ボタンにはdata-idID を持つ属性があります。ボタンをクリックするとポップアップが開きますが、data-id値を取得する方法がわかりません..

popupbeforepositionイベントが呼び出されると、ポップアップの内容が設定されます。このコンテンツは、(ボタン; からdata-id) ID を使用して ajax 呼び出しを介して取得されます。

私は webapp の単純なバージョンで JSFiddle を作成しました: http://jsfiddle.net/yW2PZ/1/

<div data-role="page">
    <div data-role="content">
        <div data-role="popup" id="media-edit-file" data-overlay-theme="a">
            Popup
        </div>

        <a data-id="1" href="#media-edit-file" data-role="button" data-transition="flip" data-rel="popup">click me</a>
        <a data-id="2" href="#media-edit-file" data-role="button" data-transition="flip" data-rel="popup">or me</a>
    </div>
</div>


$(document).on('popupbeforeposition', '#media-edit-file', function(event, ui)
{
    // how do I get the data-id value.. ?
});
4

2 に答える 2

6

代わりに、ハンドラーをタグのclickイベントにバインドすることを検討してください。aこのようにして、コールバック関数のオブジェクトをdata-id介して属性にアクセスできます。$(this)次に、メソッドを使用してプログラムでポップアップを開くことができますpopup()。

例えば：

$(document).on('click', 'a', function(event, ui) {
    var data_id = $(this).data('id');
     // ... fetch the popup's content ...
    $('#media-edit-file').popup('open');
});

jsFiddleデモを見る

HTML5データ属性へのアクセスについてもう少し

HTML5属性がjQueryによって要素のオブジェクトに自動的に追加されるときにプレフィックスが省略されるため、メソッドをとしてdata-id属性にアクセスする方法に注意してください。たとえば、これは、でアクセスできることも意味します。メソッドの詳細については、jQueryマニュアルを参照してください。data()iddata-data()data-reldata('rel')data()

于 2013-01-20T19:06:27.583 に答える