jQuery 是一種非常流行的 JavaScript 庫,用于簡化 HTML DOM 樹的遍歷和操作。其中,選中時帶有邊框是常見的一種效果。下面是一個簡單的例子:
$(document).ready(function(){ $("input").focusin(function(){ $(this).css("border", "3px solid red"); }); $("input").focusout(function(){ $(this).css("border", ""); }); });
以上代碼實現的效果是:當 input 獲得焦點時,將邊框顏色設置為紅色,并增加寬度;當 input 失去焦點時,將邊框恢復為原樣。
可以通過修改 CSS 樣式來改變選中邊框的樣式,如下:
input:focus { border: 3px solid red; }
此樣式將在 input 元素獲得焦點時生效。如果需要在其他元素上應用該樣式,則只需將選擇器更改為對應元素的選擇器即可。
綜上所述,通過 jQuery 實現選中時有邊框的效果既簡單又實用,可以提高頁面的可視性和交互體驗。
上一篇HTML的谷歌標志代碼