搜尋

首頁  >  問答  >  主體

javascript - 兩個點擊事件,大的DIV包含小的DIV,點選小的DIV,大的也會觸發,怎麼處理?

兩個點擊事件,大的p包含小的p,點擊小的p,大的也會觸發,怎麼處理?
如圖描述,現在點擊小p裡面的click,大的p也觸發,現在只想點擊小的p只觸發小的click事件,怎麼處理?


現在

某草草某草草2731 天前1316

全部回覆(8)我來回復

  • 伊谢尔伦

    伊谢尔伦2017-05-27 17:46:35

    停止傳播()

    回覆
    0
  • 给我你的怀抱

    给我你的怀抱2017-05-27 17:46:35

    在一個物件上觸發某一類事件(例如點擊onclick事件),如果此物件定義了此事件的處理程序,那麼此事件就會呼叫這個處理程序,如果沒有定義此事件處理程序或事件返回true,那麼這個事件會向這個物件的父級物件傳播,從裡到外,直到它被處理(父級物件所有同類事件都將被啟動),或者它到達了物件層次的最頂層,即document物件(有些瀏覽器是window),稱為事件冒泡。

    //阻止事件冒泡函数
    function stopBubble(e)
    {
        if (e && e.stopPropagation)
            e.stopPropagation()
        else
            window.event.cancelBubble=true
    }

    回覆
    0
  • 迷茫

    迷茫2017-05-27 17:46:35

    是JS的冒泡(捕獲)事件

    類似這樣的解決方法蠻簡單的

    $('.p1').on('click', function(event) {
        event.preventDefault();
        if ($(event.target).is('.p2')) {
            alert('click 2')
        }else{
            alert('click 1')
        }
    });

    回覆
    0
  • PHP中文网

    PHP中文网2017-05-27 17:46:35

    js冒泡 取消冒泡就行了
    事用事件委託 就不會出現這種問題了

    回覆
    0
  • 为情所困

    为情所困2017-05-27 17:46:35

    看完這兩篇文章不懂來找我:

    http://javascript.info/bubbli...
    https://stackoverflow.com/que...

    回覆
    0
  • 阿神

    阿神2017-05-27 17:46:35

    我想到有兩種解決方法:
    1.阻止事件冒泡。
    事件冒泡是從裡面的子元素逐級執行到外面的父元素,當執行子元素的點擊事件的時候,需要調用冒泡阻止事件,這樣事件就不能傳遞到上層,去執行上層的事件。
    2.根據引起點擊的元素不同來執行不同的事件。
    當點擊的元素是子元素引起的,執行A事件,如果不是子元素,則執行B事件。

    回覆
    0
  • 淡淡烟草味

    淡淡烟草味2017-05-27 17:46:35

    阻止冒泡就可以了,關於事件可看這裡 /a/11...

    回覆
    0
  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-27 17:46:35

    按照正常的做法是不會這樣觸發的,很想知道你到底用什麼選擇器來綁定點擊事件的,你貼一下你的點擊代碼和你的p的html碼更好

    回覆
    0
  • 取消回覆