web-dev-qa-db-ja.com

jqueryモバイルポップアップが機能しませんか?

jquerymobileを使用しているim。ポップアップを作成しようとしています。動作するはずのこのsimpelコードを見つけました。 http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html

例のコードを試しました

<a href="#popupBasic" data-rel="popup">Tooltip</a>

<div data-role="popup" id="popupBasic">
    This is a completely basic popup, no options set.
</div>

しかし、これを自分のコードに入れると、divは引き続き表示され、ボタンをクリックすると、ポップアップではなく別のページに移動します。誰かが私を助けることができますか?

14
Chanckjh

ええと...私はそれを動作させました(以下のサンプルコード、それ以外の場合はコードブロックに表示することができなかった文字列が混乱していることをお詫びします)...これは最新のjQueryMobileリリース候補の一部ではないようです...したがって、JSおよびCSS参照が実際に対応するコードを含むファイルを指していないため、機能していないと思いますか?

<!DOCTYPE html>
<html class="ui-mobile-rendering">
    <head>
        <meta charset="utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <title>JQM popup test</title>
        <link rel="stylesheet"
            href="http://jquerymobile.com/branches/popup-widget/css/themes/default/jquery.mobile.css"/>
        <script src="http://jquerymobile.com/branches/popup-widget/js/jquery.js"></script>
        <script src="http://jquerymobile.com/branches/popup-widget/js/"></script>
    </head>
    <body>
        <a href="#popupBasic" data-rel="popup">Tooltip</a>
        <div data-role="popup" id="popupBasic">This is a completely basic popup, no options set.</div>
        <div>Other</div>
        <div>Random</div>
        <div>Text</div>
    </body>
</html>
5
user1263226

ポップアップは1.2リリースが予定されているようです( githubのこのページ を参照)。 URLページの「ブランチ」は、このページがjQuerymobileのリリースされていないdevブランチからのものであることを示していると思います。 1.1リリースのドキュメントページを見ると、この機能は文書化されていません。

前のgithubリンクからjquery.mobile.popup.jsとcssを追加するか、ポップアップウィジェットと他のウィジェットを含む web-ui-fw project を使用して、1.0に追加できます。

私はweb-ui-fwを使用してjQuerymobile1.1でポップアップを表示します。このプラグインは、data-relおよびdata-roleに「popup」ではなく「popupwindow」を使用します

4
QuickFix