yw亚洲av无码乱码在线观看,4hu四虎永久在线观看,风流少妇按摩来高潮

国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

jquery阻止click與mouseover以及mouseout冒泡問題解決

黃舟

發(fā)布： 2017-06-28 14:21:17

原創(chuàng)

2160人瀏覽過

<ul>
                <li class="red"><a href="javascript:void(0)">項目一</a></li>
                <li class="green"><a href="javascript:void(0)">項目二</a></li>
                <li class="green"><a href="javascript:void(0)">項目三</a></li>
                <li class="green"><a href="javascript:void(0)">項目四</a></li>
            </ul>

 $(function () {
            $.each($("li"), function (i, o) {
                $(this).children("a").click(function () {
                    allhide();
                    $(this).parent("li").attr("class", "red");
                });
                if ($(this).attr("class") != "red") {
                    $(this).mouseenter(function () {
                        $(this).attr("class", "red");
                    });
                    $(this).mouseleave(function () {
                        $(this).attr("class", "green");
                    });
                }
            });
        });
        function allhide() {
            $.each($("li"), function (i, o) {
                $(this).attr("class", "green");
            });
        }
 <style type="text/css">
        li
        {
            width: 80px;
            list-style-type: none;
        }
        .red
        {
            background-color: Red;
        }
        .green
        {
            background-color: Green;
        }
    </style>

登錄后復制

 $.each($("li"), function (i, o) {
            $(this).children("a").click(function (e) {
                $("li").attr("class", "green");//不用另起函數(shù)
                $(this).parent("li").attr("class", "red");
                e.stopPropagation();
            });
            if ($(this).attr("class") != "red") {
                $(this).mouseenter(function (e) {
                    $(this).attr("class", "red");
                    e.stopPropagation();
                });
                $(this).mouseleave(function (e) {
                    $(this).attr("class", "green");
                    e.stopPropagation();
                });
            }
        });

登錄后復制

好像不起作用，還是鼠標點擊時改變這個li的樣式，但是鼠標移開時就去掉了這個樣式了，不知道是什么原因

? ?

<script type="text/javascript">
    //這里不存在冒泡呀
    $(function () {
        $("li").each(function(){
            $(this).find("a").click(function(){
                $("li").attr("class","green");
                $(this).parent().attr("class","red");
            })
        });
    });
</script>

登錄后復制

哦，不是冒泡嗎？？那我這里的點擊后移開鼠標樣式就改變了啊

$(this).children("a").click(function () {
                    allhide();
                    $(this).parent("li").attr("class", "red");
                });

登錄后復制

感覺是代碼的問題，你的$(this)指針變過了下面還能用嗎？
你用變量記錄一下var?that?=?$(this)試試

 if ($(this).attr("class") != "red") {
                    $(this).mouseenter(function () {
                        $(this).attr("class", "red");
                    });
                    $(this).mouseleave(function () {
                        $(this).attr("class", "green");
                    });
                }
            });

登錄后復制

恩，我自己也搞明白了，鼠標點擊事件時，顏色為紅色的樣式已經(jīng)變化了，而我沒有把變化的指針保存下來，以下是我修改后的代碼：?

 nodeli = $("ul li:first");
            $.each($("li"), function (i, o) {
                $(this).click(function () {
                    allhide();
                    $(this).attr("class", "red");
                    nodeli = $(this);
                    //alert(nodeli.html());
                });
                $(this).mouseover(function () {
                    $(this).attr("class", "red");
                });
                $(this).mouseout(function () {
                    $(this).attr("class", "green");
                    $(nodeli).attr("class", "red");
                    // alert(nodeli.html());
                });
            });

登錄后復制

以上就是jquery阻止click與mouseover以及mouseout冒泡問題解決的詳細內(nèi)容，更多請關注php中文網(wǎng)其它相關文章！