如何在此代碼中使用點擊jquery功能

當用戶單擊文本框時，文本框中的字體應該改變顏色，但由於某種原因它不會。如何在此代碼中使用點擊jquery功能

我有以下代碼：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    $(function() { 
     $(".textbox0").click(function() { 
     $(this).css('color', 'rgb(64, 0, 128)'); 
     }); 
    }); 
    </script> 
    <style type="text/css"> 
    .textbox0 { 
     position: fixed; 
     left: 131px; 
     top: 38px; 
     font-family: Arial; 
     font-size: 8px; 
     font-weight: normal; 
    } 
    </style> 
</head> 

<body> 
    <div class="textbox0"><textarea rows=7 cols=30>Change colour</textarea></div> 
</body> 
</html>

我相信我做了正確的一切將此方法與按鈕的工作，但我想我沒有。

來源

2012-01-15 thelost

您需要更改應用到textarea元素，而不是div：

$(".textbox0 textarea").click(function() { 
    $(this).css('color', 'rgb(64, 0, 128)'); 
});

這裏有一個working example。

如果你需要保持綁定到.textbox0元素，而不是textarea的click事件處理程序，您可以使用事件處理程序中的find（或children）方法將更改應用於該textarea：

$(".textbox0").click(function() { 
    $(this).find("textarea").css("color", "rgb(64, 0, 128)"); 
});

來源

2012-01-15 00:16:09

如果你能解釋*爲什麼會這樣，但是我有一種預感，你並不確定你自己。 – coreyward 2012-01-15 00:24:09

我知道這是爲什麼（現在我的解釋中沒有什麼重要的，因爲你已經在你的答案中這樣做了）。爲什麼你有一種我不知道的直覺？另外，由於OP想要改變'textarea'的顏色，如果在某個點上'div'中有更多文本，你的方法會發生什麼？將變化應用於'div'會導致對該文本進行不必要的更改，但它也會影響'textarea'。 – 2012-01-15 00:28:58

你正在做假設A）'div'服務的目的不是操縱'textarea'的位置，B）將來會添加其他文本，以及C）將顏色應用到'textarea'是無意的。教一個人去釣魚... – coreyward 2012-01-15 00:31:00

您應該在您的存取器中添加「textarea」標籤。

我把這裏的代碼：http://jsfiddle.net/qfvVv/

來源

2012-01-15 00:17:43 Zakaria

在樣式表的變化正在對div進行，而不是在分區內textarea。

您可以通過多種方式更改此設置：把類的textarea 或您的jQuery選擇更改爲.textbox0 textarea 或更改單擊事件的代碼來改變textarea的CSS在div。

來源

2012-01-15 00:20:39

這是不是因爲你的click結合需要在textarea的。

也不是因爲您需要使用指定的CSS顏色。

也與onDomReady事件有關。

所有你需要讓你的代碼工作是CSS的簡單的一行：

textarea { color: inherit; }

在您的textarea文本不變色的原因是用戶的樣式大部分瀏覽器都高級聯優先於inherit。這很好，否則你會看到一些非常怪異的textareas浮動。 ;）

來源

2012-01-15 00:23:37 coreyward

如何在此代碼中使用點擊jquery功能

回答

相關問題