Question

我正在使用http://jaukia.github.io/zoomooz/缩放网页上的元素。

但是，当我通过.append()动态添加元素时，元素不会缩放。

我厌倦了使用.on并手动执行操作但没有成功。

$(document).on("click", ".lot", function () {
                $(this).zoomTarget();
            });

这是我的HTML

 <div class="zoomViewport">
            <div class="lotmap zoomContainer">
 </div></div>

点击后，div class="zoomViewport"中添加的数据属性为data-targetsize="0.05"和类zoomTarget的所有元素都会被缩放。

示例： <img class="zoomTarget lot" data-targetsize="0.05" src="../images/sold.png"/>

我将元素附加到lotmap。任何帮助将不胜感激。

编辑：事件正在解雇，但我需要插件事件在动态添加元素之前按原样运行。

Answer 1

我和zoomooz有同样的问题。在此示例中，您可以通过单击按钮来创建新元素。在创建新元素之后，您只需使用zoomTarget（）调用zoomooz：

    <button> Make A Box </button>

    <div class="zoomViewport">
        <div id="container" class="zoomContainer">
            <div class="box zoomTarget"> </div>
        </div>
    </div>

    <script>

        function _calls_zoom(){
            $(".box").zoomTarget();
        }

        $("button").click(function(){
            $("#container").append("<div class='box'></div>");
            _calls_zoom();
        });

    </script>

不是一个完美的例子，但是我uploaded a working copy在我的服务器上，其中包括我的一些笔记以及下载链接，因此您可以抓住示例并根据您的需要进行调整。

动态添加元素时，JQuery事件不会触发

1 个答案: