基本上我有一個表單(ID =「表單」)background-color: #000000; border: 1px solid #fff;
我想將其更改爲background-color: #ffffff; border: 1px solid #000;
一旦有人點擊它。我嘗試使用CSS:focusm,但顯然它不適用於窗體。那麼是否有jQuery解決方案? 此外,一旦用戶從形式(所以當它沒有焦點)點擊了它應該返回到background-color: #000000; border: 1px solid #fff;
如何在某人點擊某個表單時添加樣式,並在有人點擊時刪除此樣式
回答
我不相信form
元素可以觸發事件focus
所以你可能是很重要的do是根據表單中所有元素的blur
和focus
事件設置顏色。
標記:
<form id="myForm" method="post">
<input type="text" />
<input type="text" />
</form>
的jQuery:
//receives focus
$("input, select").focus(function() {
$("#myForm").css("background-color", "#fff");
//OR
//to swap a class with the CSS defined instead do this
$("#myForm").addClass("your-class-name");
});
//loses focus
$("input, select").blur(function() {
$("#myForm").css("background-color", "#000");
//OR
//to swap a class with the CSS defined instead do this
$("#myForm").removeClass("your-class-name");
});
選擇input, select
將選擇頁面中所有輸入和下拉菜單。如果需要的話,你可以通過在表單ID前添加進一步限制它。
工作,一個問題,如果我想添加多個css規則將它看起來像這樣?:$(「input,select」)。focus(function() {(「#myForm」).css(「background-color」,「red」); $(「#myForm」).css(「border」,「black」); }); – Ilja 2011-12-30 15:11:39
是的,你可以這樣做,但我建議你創建一個CSS類並切換類。 – Craig 2011-12-30 15:14:57
@IlyaKnaup我已經更新了答案,以反映如何應用和刪除一個用一行定義所有CSS樣式的類。 – Craig 2011-12-30 15:19:49
另一種選擇:http://jsfiddle.net/6TrGg/
$(document).ready(function(){
$(".form").mouseover(function(){
$(".form").removeClass("form").addClass("form2");
$(".form2").mouseout(function(){
$(".form2").removeClass("form2").addClass("form");
});
});
});
+1另一個很好的解決方案。乾杯 – Craig 2011-12-30 17:04:51
- 1. jQuery - 加載時添加按鈕樣式,並在單擊其他人時刪除樣式。
- 2. AngularJS - 無法刪除另一個樣式添加點擊後的懸停樣式
- 3. 如何在表格標題上應用樣式時纔會點擊並刪除樣式當我點擊任何其他表格標題時?
- 4. CSS點擊時只顯示樣式表
- 5. 如何在鏈接中點擊某個div時添加文本
- 6. jQuery在點擊時添加樣式到ID
- 7. 如何刪除樣式單擊事件?
- 8. 如何知道某人何時點擊了Adview?
- 9. 使用jQuery添加,然後刪除(然後添加)連續點擊樣式表
- 10. 單擊刪除當前標記並在點擊時添加一個新標記
- 11. 刪除點擊機器人
- 12. 刪除按鈕的第二次點擊後附加樣式表
- 13. 點擊button1並添加文本到div,點擊button2並刪除文本和css樣式button1
- 14. 點擊複選框時的css樣式
- 15. 添加DIV時點擊錨點,並刪除DIV時單擊任一外部或在不同的錨點
- 16. 如何點擊某個按鈕時增加一個計時器?
- 17. 如何在點擊後暫時改變Android按鈕樣式?
- 18. 如何在點擊時更改ListItem的樣式?
- 19. 每當點擊某個東西時,用jquery刪除一個iframe
- 20. 如何在點擊某個列表項時更改div的值?
- 21. 點擊更改樣式
- 22. ToggleButton樣式點擊行爲
- 23. 點擊切換CSS樣式
- 24. 如何讓某人在pygame中重複點擊?
- 25. 如何在點擊時刪除按鈕?
- 26. 用戶點擊刪除後如何刪除個人評論?
- 27. javascript添加樣式刪除樣式
- 28. 如何在點擊var ID時添加/刪除類元素?
- 29. 如何在有人點擊按鈕時刪除/隱藏藍色邊框線
- 30. HSSF單元格樣式只有在點擊它在Excel
有你看着http://api.jquery.com/focus/ – 2011-12-30 14:58:31
$( '#形式')專注(函數(){//什麼我。放在這裏來定義新的CSS規則?});這是我到目前爲止的想法,我對jQuery不太好,我該如何定義新的css? – Ilja 2011-12-30 15:00:11
稍有不同:http://jsfiddle.net/A69Fm/ – 2011-12-30 15:12:28