Question

我试图在我的网页上的每个项目周围添加一个大纲，其中的一个类以＆＃34; col - ＆＃34;开头。然后将图像放在大纲的右上角，供用户单击，如下所示;

<img id="elementMenu" src="Images/ElementMenu.png" style="display: none" ng-click="menuClick()" />
<div class="container">
    <div class="row">
        <div class="col-lg-3 col-lg-offset-1">
            <h1>This is my heading</h1>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-5 col-lg-offset-1">
            <p>This is my content</p>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-10 col-lg-offset-1">
            <h1>This is my heading</h1>
            <p>This is my content</p>
        </div>
    </div>
</div>

我的脚本是;

(function () {
    var app = angular.module("myApp", ["ngRoute", "ui.bootstrap"]);
}());

(function () {
    var app = angular.module("myApp");
    var $element = {};

    var editorController = function ($scope) {
        $scope.menuClick = function () {
            alert("Menu clicked");
        };

        $("document").ready(function () {
            $("*[class*='col-']")
            .mouseenter(function () {
                $element = $(this);
                $element.addClass("highlightColumn");

                var offset = $element.offset();
                var width = $element.width();

                var $menu = $("#elementMenu");
                var menuWidth = $menu.width()
                var menuOffset = $menu.offset();

                var menuLeft = offset.left + width - menuWidth;
                $menu.css({ position: "fixed", margin: 0, left: menuLeft, top: offset.top, display: "block" })
            })
            .mouseleave(function () {
                $element.removeClass("highlightColumn");
                $("#elementMenu").css({ display: "none" });
            });
        });
    };

    app.controller("myController", ["$scope", myController]);
}());

当鼠标位于列元素上时，将显示边框和图像，但是单击图像不会显示警报。如果我将图片的样式更改为＆＃34;显示：＆＃39; block＆＃39;＆＃34;并刷新页面我可以点击图像并显示警报但是当图像重新定位后，当鼠标移动到列元素上时，单击图像不再显示警报。

隐藏和显示图片或重新定位图像是否存在阻止点击事件触发的问题？

angularJS ng点击未调用的图像

0 个答案: