0

Web アプリに jquery ui ダイアログ ボックスを実装しようとしていますが、まったく機能していないようです。私はPHPを使用しています。

forダイアログと、クリックするとダイアログを開くボタンを定義するPHPコードがあります。

    <div id="dialog">This should show up </div> 
<button id="opener">Open Dialog</button>

別の JS ファイルがあり、ready 関数内に次のコードがあります

$("#dialog").dialog({autoOpen:false}); 


$("#opener").click(function()
{
    $("#dialog").dialog("open");
});

ボタンをクリックしても、ダイアログが開かないようです。私は使っている

  • jquery V1.7.1
  • jquery UI V 1.8.20

なぜそれがうまくいかないのか、誰でも私を助けることができますか？

また、autoOpen を true に設定してみましたが、ページの読み込み時にはダイアログが正常に機能しているように見えますが、クリック時には機能しません。

助けてくれてありがとう

4

2 に答える 2

1

ページが読み込まれた後にクリック コードが実行されていることを確認してください。確かに、JS コードを jQuery の.ready()でラップしました。

次の例は、あなたが尋ねるようにする必要があります。さらにサポートが必要な場合は、確認してデバッグできる URL を投稿することをお勧めします。

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Test</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <script>
    //Wait until the document is ready to be processed.
    jQuery(document).ready(function()
    {
        //Init your dialog box.
        $("#dialog").dialog({autoOpen:false}); 

        //Attach you click handler to the button.
        $("#opener").click(function(event)
        {
            //Stop any default actions on the button.
            event.preventDefault();
            //Open your dialog.
            $("#dialog").dialog("open");
        });
    });
    </script>
</head>
<body>

<div id="dialog">This should show up </div> 
<button id="opener">Open Dialog</button> 

</body>
</html>
于 2012-11-16T21:42:15.460 に答える
0

これは機能するはずです：

$("#opener").on('click', function(){
    $("#dialog").dialog("open");
});​

これがJSFiddleの動作です

于 2012-11-16T21:41:29.110 に答える