弹出模态对话框

发布于 2024-12-23 15:09:08 字数 1029 浏览 2 评论 0原文

使用这篇帖子我已经能够实现一个出现一次的对话框表单已加载。不过,我想更改此设置,以便用户单击按钮即可显示对话框。

我已按照提供的指导进行操作,并按照指示从 Javascript 函数中删除了此行 $("#divdeps").dialog('open'); ,并将其添加到 'onclick' 事件中我的按钮,

<button type="button" value="Upload" onclick="$('#divdeps').dialog('open');">Upload</button>

所以我的代码现在是:

<div id="divdeps" style="display: none">This is my div</div>
<button type="button" value="Upload" onclick="$('#divdeps').dialog('open');">Upload</button>
<script> 
$(document).ready(function(){
  $("#divdeps").dialog({
    autoOpen: false,
    show: 'slide',
    resizable: false,
    position: 'center',
    stack: true,
    height: 'auto',
    width: 'auto',
    modal: true
  });

 // $("#divdeps").dialog('open');
});

</script>

但是,我无法让它在按钮的“onclick”事件上工作。我已经按照说明看了好几次了,但我不确定我哪里出错了。

我只是想知道是否有人可以看一下这个并让我知道我做错了什么。

非常感谢和问候

Using this post I've been able to implement a dialog box that appears once the form is loaded. I would however like to change this so that the user clicks a button for the dialog to appear.

I've followed the guidance provided, and removed this line $("#divdeps").dialog('open'); from the Javascript function as instructed, and added it to the 'onclick' event of my button i.e.

<button type="button" value="Upload" onclick="$('#divdeps').dialog('open');">Upload</button>

so my code is now:

<div id="divdeps" style="display: none">This is my div</div>
<button type="button" value="Upload" onclick="$('#divdeps').dialog('open');">Upload</button>
<script> 
$(document).ready(function(){
  $("#divdeps").dialog({
    autoOpen: false,
    show: 'slide',
    resizable: false,
    position: 'center',
    stack: true,
    height: 'auto',
    width: 'auto',
    modal: true
  });

 // $("#divdeps").dialog('open');
});

</script>

However, I can't get this to work on the 'onclick' event of the button. I've been through the instructions quite a few times now and I'm not sure where I'm going wrong.

I just wondered whether someone could perhaps take a look at this please and let me know what I'm doing wrong.

Many thanks and regards

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

坏尐絯℡ 2024-12-30 15:09:09

使用此代码在我的应用程序中工作。

PopUpWindow = function (titles, message, redirectURL) {
        document.getElementById('window').innerHTML = message;
        $("#window").dialog({
            resizable: true,
            height: 180,
            title: titles,
            width: 500,
            modal: false,
            open: function () {
                $('.ui-widget-overlay').show();
                $('.ui-dialog-titlebar-close.ui-corner-all').hide();
            },
            buttons: {
                "OK": function () {
                    $(this).dialog("close");
                    if (redirectURL) {
                        window.location = redirectURL;
                    }
                }
            }
        });
    };

div 标签

  <div id="window" style="display: none;width:190px"> 

如果您有任何问题,请告诉我。

Use this code its working in my application.

PopUpWindow = function (titles, message, redirectURL) {
        document.getElementById('window').innerHTML = message;
        $("#window").dialog({
            resizable: true,
            height: 180,
            title: titles,
            width: 500,
            modal: false,
            open: function () {
                $('.ui-widget-overlay').show();
                $('.ui-dialog-titlebar-close.ui-corner-all').hide();
            },
            buttons: {
                "OK": function () {
                    $(this).dialog("close");
                    if (redirectURL) {
                        window.location = redirectURL;
                    }
                }
            }
        });
    };

div tag

  <div id="window" style="display: none;width:190px"> 

Let me know if you have any problem here.

脱离于你 2024-12-30 15:09:08

我会使用 jQuery 的 click 函数而不是 dom level 0 处理程序来完成此操作:

$("#divdeps + button").click(function() { $("#divdeps").dialog('open'); });

或者当然你可以给这个按钮一个 id 并执行

$("#buttonID").click(function() { $("#divdeps").dialog('open'); });

这些代码部分中的任何一个都会进入你的 document.ready 处理程序。


根据 Virendra 的评论,您原来的按钮标签是错误的 - 您缺少结束标签,并且引号不匹配:

<button value="Upload" onclick="$("#divdeps").dialog('open');"</button> 

应该是

<button value="Upload" onclick="$('#divdeps').dialog('open');"> </button> 

I would do it with the click function of jQuery instead of that dom level 0 handler:

$("#divdeps + button").click(function() { $("#divdeps").dialog('open'); });

Or of course you can give this button an id and do

$("#buttonID").click(function() { $("#divdeps").dialog('open'); });

Either of those sections of code would go in your document.ready handler.


Per Virendra's comment, your original button tag was wrong—you were missing a closing tag, and have mismatched quotes:

<button value="Upload" onclick="$("#divdeps").dialog('open');"</button> 

should have been

<button value="Upload" onclick="$('#divdeps').dialog('open');"> </button> 
巾帼英雄 2024-12-30 15:09:08

而不是您注释掉的 $("#divdeps").dialog('open'); ,请尝试:

$("button#give_it_some_id").click(function(e) {
    e.preventDefault();
    $("#divdeps").dialog('open');
})

Instead of $("#divdeps").dialog('open'); that you commented out, try:

$("button#give_it_some_id").click(function(e) {
    e.preventDefault();
    $("#divdeps").dialog('open');
})
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文