如何閱讀任何點擊元素的css屬性？

我試圖製作一個jQuery的顏色選擇器，它應該讀取任何元素被點擊的背景顏色並將其返回到.result div中。如何閱讀任何點擊元素的css屬性？

問題：我如何描述「當前點擊」元素？

這是我的代碼：

$("p").click(function() { 
    var color = $("p").css("background-color"); 
    $(".result").html("That div is <span style='color:" + 
        color + ";'>" + color + "</span>."); 
});

我想這對於其被點擊，而不是僅限於P任何元素的工作。有沒有簡單的方法來做到這一點？

來源

2012-12-01 user1721135

$(document).click(function(ev){ 
    var color = $(ev.target).css("background-color"); 
});

http://jsfiddle.net/tarabyte/9v2rA/

來源

2012-12-01 13:16:50

這應該在大多數情況下工作，但不適用於內部具有'event.stopPropagation（）'或'return false'的點擊處理程序的元素 - 因爲這些事件不會傳播到'文件'對象。 – techfoobar

如果您正在討論一個顏色選擇器框，其中包含幾個代表每種顏色的p元素，所以您不需要在ANY元素上分派所有click事件。您可以使用p s。您可以使用this引用到目前點擊p：

var color = $(this).css("background-color");

所以，你的代碼將是：

$("p").click(function() { 
    var color = $(this).css("background-color"); 
    $(".result").html("That div is <span style='color:" + 
        color + ";'>" + color + "</span>."); 
});

而你的HTML可能是：

<div class="color-picker"> 
    <p style="background-color: #111;"></p> 
    <p style="background-color: #333;"></p> 
    <p style="background-color: #666;"></p> 
    <p style="background-color: #999;"></p> 
</div>

來源

2012-12-01 13:16:46

這將選擇'p'元素的顏色。 –

@Aram Alipoor：以及它如何幫助'任何'元素？您仍然需要在頁面上的每個元素上綁定此處理程序。 –

那麼，這個問題明確指出：'它應該讀取任何元素被點擊的背景顏色'和'[...]不僅p':)。 –

如何閱讀任何點擊元素的css屬性？

回答

相關問題