我刚刚开始学习jquery,但是我被困在这里吃了这一部分,因为我的click事件多次被触发。 也许这是一个愚蠢的问题,但这使我发疯,因为我已经搜寻了数小时来解决此问题,却一无所获。

<script type='text/javascript'>
    $(document).ready(function(){
        var movie_id;
        var m_hover_time;
        var loader = "<img class='loader' src='images/loader.gif' />";
        $("#mhb .each_movie").mouseenter(function(){
            movie_id = $(this).attr("movie_id");
            m_hover_time = setTimeout(function(){
                $("[movie_id='"+movie_id+"'] .each_movie_box").append(loader).slideDown();
                $.post("ajax/movie_load.php",{load_type:2, movie_id:movie_id}, function(movie_info){
                    $("[movie_id='"+movie_id+"'] .each_movie_box").html(movie_info);
                });
            }, 1500);
 $("[movie_id='"+movie_id+"'] .newsfeed_it").click(function(){
            alert(movie_id);
            return false;
        });
        }).mouseleave(function(){
            clearInterval(m_hover_time);
            $("[movie_id='"+movie_id+"'] .each_movie_box").html(" ").slideUp();
        });
    });
</script>

jQuery代码后有一个php脚本,可返回所有类似这样的电影:

<div class='each_movie' movie_id='{$each_movie['id']}'> <!-- Each movie start here -->
                <div class='each_movie_box'>
                    <!-- each_box -->
                </div>
                <div class='each_movie_thumb' style='background-image:url({$each_movie['thumb']});'>
                    <div class='each_movie_hover'>
                        <div class='emh_top'><img src='images/movie_info.png' class='newsfeed_it' /></div>
                        <a href='filma.php?filmi={$each_movie['id']}'><div class='emh_play'></div></a>
                        <div class='emh_bottom'>
                            <img src='images/movie_fav.png' />
                            <img src='images/movie_later.png' />
                        </div>
                    </div>
                </div>
                <div class='each_movie_info'>
                    <a href='filma.php?filmi={$each_movie['id']}'>
                        <span class='name'>{$each_movie['title']}</span>
                    </a>
                    <span class='categories'>{$movie_categories}</span>
                    <span class='views'>{$each_movie['views']} Shikime</span>
                </div>
            </div>

我什至尝试过event.stopPropagation()方法,但没有解决它:/

===============>>#1 票数:2

您不应将click事件处理程序附加在mouseenter因为这样,每次将鼠标移到它上面时,您都会重新添加偶数处理程序。 每当您单击时, click均匀事件处理程序将与触发mouseenter事件一样执行多次。 尝试以下方法:

$(document).ready(function(event){
    $("#mhb .each_movie").each(function(){
        var movie_id = $(this).attr("movie_id");
        $("[movie_id='"+movie_id+"'] .newsfeed_it").click(function(){
            alert(movie_id);
            return false;
        });
    });
});

演示: http//jsfiddle.net/mD8fp/

===============>>#2 票数:1

问题是您将每个新的click事件与每个“ mouseenter”绑定在一起,这会使事件成倍增加。 因此,如果您多次单击鼠标并单击您的元素,则该事件将触发多次(与您的鼠标进入元素的次数相同)。

您可以做的是使用.each()函数遍历元素,然后将click事件分别绑定到每个事件。 您无需触发mousenter事件即可绑定click事件。

然后,要引用movie_id数据,可以使用.parents()函数向后搜索父容器,然后从匹配的父元素中获取数据。

尝试这个:

$(document).ready(function(event){
    $("#mhb .each_movie").each(function() {
        var $img = $(this).find('.newsfeed_id');

        //Bind a click event to the image element.
        $img.click(function() {
            var $this = $(this);
            $parent = $this.parents('.each_movie');  //Search for parents with class .each_movie
            movie_id = $parent.data('movie_id'); //Get the movie_id from the parent.

            alert(movie_id);
            return false;
        });
    });
});

您还将注意到,我使用的是data('movie_id') ,这是从元素中检索自定义数据的更合适的方法。 您应该使用data-movie_id='{$each_movie['id']}'在标签上设置数据,如下所示:

<div class='each_movie' data-movie_id='{$each_movie['id']}'>

从那里,您可以使用$(this).data('movie_id');检索值$(this).data('movie_id');

在这里阅读有关.data()标记的更多信息: http : //api.jquery.com/data/

在此处查看工作示例: http : //jsfiddle.net/tNpmP/

另外,我相信您有错字。 您的HTML中有.newsfeed_it ,但是您在javascript中正在调用.newsfeed_id

===============>>#3 票数:0

尝试向函数添加布尔值,因此在函数集之外:

var entered = false;

在功能集内:

entered = true;

然后添加一个mouseleave函数

entered = false;

这应该可以解决您的问题

  ask by Dorjan Vulaj translate from so

未解决问题?本站智能推荐: