【问题标题】:How to stop jQuery dialog to delete the original content如何停止 jQuery 对话框以删除原始内容
【发布时间】:2015-04-02 12:14:28
【问题描述】:

所以我的网站上有一张图片。当我单击该图像时,会弹出一个 jQuery 对话框并将该图像放置在我的对话框中。唯一的问题是我的图像从我的网站上消失了。因此,我的对话框中只有我的图像,而不再出现在我的网站上。如何更改它以使图像在单击图像后进入我的对话框后仍保留在我的网站上?

这是我的代码:

<body>
<img src="http://www.c-and-a.com/iview/FRONT_ZOOM2X/148243_1.jpg"
     data-swap="http://www.c-and-a.com/iview/BACK_ZOOM2X/148243_1.jpg" id="images">

<script>
    $(function () {
        $(document).ready(function () {
            $('body').jqueryPlugin();
        });
    });
</script

这是我的 javascript:

(function ($) {
    $.fn.jqueryPlugin = function () {
        $("#images").click(function () {
            var _this = $(this);
            var current = _this.attr("src");
            var swap = _this.attr("data-swap");

            _this.attr('src', swap).attr("data-swap", current);

            $("#images").dialog({
                dialogClass: "no-close",
                width: 'auto',
                height: 'auto',
                resize: "auto"
            });
        });
    };
})(jQuery);

【问题讨论】:

  • 你检查我的答案了吗??

标签: jquery html jquery-mobile dialog


【解决方案1】:

使用下面的代码。当对话框再次关闭时,交换图像 src 并销毁对话框。见DEMO

如果您想在对话框打开时将图像保留在背景中,请查看DEMO

已添加另一个 DEMO 并进行了一些更新

 $("#images").dialog({
            dialogClass: "no-close",
            width: 'auto',
            height: 'auto',
            resize: "auto",
            close : function(){
               $("#images").dialog( "destroy" );
             _this.attr('src', current).attr("data-swap",swap);
        }
    });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多