jQuery是一種JavaScript庫,它可以讓我們更輕松地處理HTML文檔和事件。在Web開發中,input元素是非常常見的,而以藍色高亮顯示已選中的input元素也可以提供更好的用戶體驗。以下是使用jQuery實現選中藍色效果的示例代碼:
// 選中藍色效果 $('input[type=radio], input[type=checkbox]').each(function() { $(this).wrap(''); $(this).after(''); }); $('input[type=radio], input[type=checkbox]').change(function() { if ($(this).is(':checked')) { $(this).parent().addClass('custom-' + $(this).attr('type') + '-checked'); } else { $(this).parent().removeClass('custom-' + $(this).attr('type') + '-checked'); } });
上述代碼可以處理單選框和復選框的選中狀態。首先,使用each()函數遍歷所有單選框和復選框將它們進行包裝和標記。然后,使用change()函數檢測單選框和復選框的狀態變化,并添加或刪除選中狀態的類名。通過添加自定義的類名和樣式,可以輕松地實現選中藍色效果,提高用戶體驗。