【问题标题】:jquery dialog - multiple dialogs on page, only open one at a timejquery dialog - 页面上有多个对话框,一次只能打开一个
【发布时间】:2011-09-01 23:09:04
【问题描述】:

我在一页上有 12 个对话框。如果其他 12 个对话框均未打开,我只希望它们打开。我不希望它关闭现有的并打开一个新的,我只是希望它一次只打开一个对话框,并阻止用户一次打开两个。

示例 HTML:

               <div id="thumb2" class="suiting-thumb">
                    <img src="img/gallery/suit1-thumb.jpg" alt="" title="" />
                </div>
                <div id="galleryDialog2" class="galleryDialog">
                    <a id="prev-arrow" href="#"></a> 
                    <a id="next-arrow" href="#"></a>
                    <div class="text">
                        text and link
                    </div>
                    <div class="dialog-slider">
                       <img src="img/suiting-details/custom-suiting-vent-styles.jpg" alt="" title="" />                       
                       <img src="img/suiting-details/custom-suit-coat-lining.jpg" alt="" title="" />
                   </div>
               </div>                   

JS:

        /* Gallery Dialog Settings */
        $('[id^=galleryDialog]').dialog({ 
                width: 480,
                height:479, /* 479 seems to be the magic number to get the box to fit vertically on the slider */
                show: 'fade',
                hide: 'fade',
                autoOpen: false,
                draggable: false,
                open: function() {
                    $('#four').stop().fadeTo("fast", 0.3);
                    $('.suiting-thumb').stop().fadeTo("fast", 1.0);
                    $("a#prev").attr("id","prev-false");
                    $("a#next").attr("id", "next-false");
                    $('.suiting-thumb').attr('class', 'suiting-thumb-false');
                },
                close: function() {
                    $('#four').stop().fadeTo("normal", 1);
                    $("a#prev-false").attr("id","prev");
                    $("a#next-false").attr("id", "next");
                    $('.suiting-thumb-false').attr('class', 'suiting-thumb');
                }
        });

        $('.suiting-thumb').click(function() {
            //strip off prefix of thumb id to get number for dialog
            var thumbBtnIdPrefix = 'thumb';
            var thumbBtnNum = $(this).attr('id').substring((thumbBtnIdPrefix.length));
            if(!$('.galleryDialog').dialog("isOpen")) {
                $('#galleryDialog' + thumbBtnNum).dialog('open').dialog('widget').position({ 
                    at: 'center center', 
                    of: $('#slider'),
                    offset: "75 0"
                });
            }
        });

我正在尝试使用 if 语句来检查是否“.galleryDialog”(应用于所有对话框 div 的类)未打开。如果未打开,则打开单击的对话框。每当您打开“galleryDialog1”时,它都能正常工作,但是当我关闭第一个并打开另一个时,您可以一次打开任意多个。

任何帮助都会令人惊叹。谢谢!

【问题讨论】:

  • 也许您可以设置一个全局布尔值,然后在打开新对话框之前检查该值?

标签: jquery user-interface dialog


【解决方案1】:

为什么不将modal: true 添加到对话调用中,那样您一次只能查看一个。

【讨论】:

  • @nickff,记得尽可能选择accepted answer
猜你喜欢
  • 1970-01-01
  • 2011-02-14
  • 1970-01-01
  • 2014-06-19
  • 2010-12-14
  • 1970-01-01
  • 1970-01-01
  • 2015-04-05
  • 1970-01-01
相关资源
最近更新 更多