jquery 簡單5行代碼 點擊彈出動態生成的圖片

如圖 上級要求在直播內容區域點擊圖片彈出新窗口,簡單分析一下:每條信息包含着文字和圖片以及調用網友回覆的dome
也就是有3個層級 text 、 images 、blockquote、

直播區域每天有上千條數據 比較傳統的做法是在for循環裏面取圖片的索引 indexOf
用jq on click 點擊
獲取圖片 data-index = "'+data.images+'"

這樣的做法顯然比較蠢並且會加重web負擔


後來發現 這樣寫豈不是直接一步到位簡潔明瞭

直接上代碼

[code=javascript]
$("#expertMessageToday").on("click",".chat-message","img",function(e){ //.chat-message直播信息的父級  
    var initialization =e.currentTarget.innerHTML;
    var alert_blank = $(initialization).children("img");                // children 返回所有子節點  P標籤下就一個img 直接取到img的src
  
    if (alert_blank[0].currentSrc != "") {                                // 這裏有有一個坑 圖片未加載 彈出的會是一個空  so + 一個判斷
           window.open(alert_blank[0].currentSrc, '_blank');
    }
});
[/code]

var alert_blank = $(initialization).children("img");    

 

window.open(alert_blank[0].currentSrc, '_blank');

彈出新窗口

如果要當前網頁打開 window.location.href = (alert_blank[0].currentSrc, '_blank');

 

這裏在囉嗦一句 location 是指定當前你打開的的地址欄! location.href 不能打開新窗口!

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章