HTML5全選功能代碼
HTML5全選功能是網頁開發中非常常見的功能之一,它可以方便用戶一次性選擇所有的選項。下面是實現HTML5全選功能的代碼示例。
首先,在HTML頁面中添加一個全選的復選框。
<input type="checkbox" id="selectAll" onClick="toggle(this)"> 全選這個復選框的id屬性為“selectAll”,當用戶點擊它時,會執行JavaScript中的toggle函數。下面是toggle函數的代碼。
<script type="text/javascript"> function toggle(source) { var checkboxes = document.querySelectorAll('input[type="checkbox"]'); for (var i = 0; i < checkboxes.length; i++) { if (checkboxes[i] != source) checkboxes[i].checked = source.checked; } } </script>通過這個函數,我們可以選擇所有的復選框,當用戶點擊全選的復選框時,所有的選項都會被選中,反之亦然。 以上就是HTML5全選功能的代碼實現方法。通過這個功能,我們可以讓用戶方便快捷地選擇所有的選項,提高用戶體驗。