0

こんにちは、リンクがクリックされたときにのみ表示されるポップアップを作成しようとしています。これは私が持っているコードですが、問題は、クリックしたときではなく、ページが読み込まれたときにダイアログが表示されることです。

<script type="text/javascript">
    $(document).ready(function () {
        $("#OpenDialog").click(function () {
            $("#dialog").dialog({ modal: true, height: 250, width:200 });
        });
    });
</script>
<a id="OpenDialog" href="#">Click here to open dialog</a>
<div id="dialog" title="Dialog Title">
    <p>Dialog Contents here</p>
</div>
4

3 に答える 3

0

最初に display:none; のような表示プロパティを設定します。

<script type="text/javascript">
$(document).ready(function () {
    $("#OpenDialog").click(function () {
$("#dialog").show();
        $("#dialog").dialog({ modal: true, height: 250, width:200 });
    });
});
</script>
<body>
<a id="OpenDialog" href="#">Click here to open dialog</a>
<div id="dialog"  style="display:none;"title="Dialog Title">
<p>Dialog Contents here</p>
</div>
于 2013-04-05T12:00:52.283 に答える
0

これを置き換えるだけです：

<div id="dialog" style="display:none;" title="Dialog Title">
    <p>
        Dialog Contents here</p>
</div>

設定 

  style='display:none'
于 2013-04-05T11:54:59.197 に答える
-1

代わりに関数を呼び出してみてください:

var dialogBox = function()  {
   $("#dialog").dialog({ modal: true, height: 250, width:200 });
};
$(document).ready(function () {

    $("#OpenDialog").click(function () {
        dialogBox();
    });
});

HTML の場合:

<div id="dialog" title="Dialog Title" style='display:none;'>
    <p>Dialog Contents here</p>
</div>
于 2013-04-05T11:50:00.157 に答える