У меня есть следующий HTML-код в теле страницы – это флажок только ввода типа на этой странице HTML:
<fieldset> <legend>North Face</legend> N-A1: <input type="checkbox" name="NorthFace" value="N-A1" id="NA1"> N-B2: <input type="checkbox" name="NorthFace" value="N-B2" id="NB2"> N-C3: <input type="checkbox" name="NorthFace" value="N-C3" id="NC3"> N-D4: <input type="checkbox" name="NorthFace" value="N-D4" id="ND4"> N-E5: <input type="checkbox" name="NorthFace" value="N-E5" id="NE5"> N-F6: <input type="checkbox" name="NorthFace" value="N-F6" id="NF6"> N-G7: <input type="checkbox" name="NorthFace" value="N-G7" id="NG7"> N-H8: <input type="checkbox" name="NorthFace" value="N-H8" id="NH8"> </fieldset> <br /> <fieldset> <legend>South Face</legend> S-A1: <input type="checkbox" name="SouthFace" value="S-A1" id="SA1"> S-B2: <input type="checkbox" name="SouthFace" value="S-B2" id="SB2"> S-C3: <input type="checkbox" name="SouthFace" value="S-C3" id="SC3"> S-D4: <input type="checkbox" name="SouthFace" value="S-D4" id="SD4"> S-E5: <input type="checkbox" name="SouthFace" value="S-E5" id="SE5"> S-F6: <input type="checkbox" name="SouthFace" value="S-F6" id="SF6"> S-G7: <input type="checkbox" name="SouthFace" value="S-G7" id="SG7"> S-H8: <input type="checkbox" name="SouthFace" value="S-H8" id="SH8"> </fieldset> У меня есть кнопка SUBMIT на этой HTML-странице, которая при нажатии пользователем запускает некоторый javascript, который должен оценить эти флажки, поэтому я делаю следующее:
var checkboxes = document.querySelectorAll("input[type=checkbox");
до сих пор каждый раз, когда я проверил флаги в массиве, индексы 0-7 флажков имеют N-A1-N-H8, а индексы 8-15 – S-A1-S-H8.
Вопрос 1: до тех пор, пока они остаются единственным типом флажка на этой странице HTML, и они всегда находятся в этом порядке на странице, этот порядок в блоке флажков всегда гарантирован? (т. е. первые 8 всегда будут N-xx, а второй 8 всегда будет S-xx?)
Вопрос 2: если флажок get добавлен где-то еще на этой HTML-странице, я получаю так, что бы лучший способ получить только этот набор флажков? Поместите sometype div с id вокруг этих двух полей или поместите некоторый тип id на каждый из этих полей, таких как «север» и «юг». Дайте быстрый пример того, как извлечь флажки в этом случае.
Вопрос 3: в самом конце я хочу отправить только те флажки, которые были отмечены на моем PHP-сервере. В настоящее время я использую цикл for в javascript на флажках, чтобы определить, какие флажки отмечены в javascript, затем отправьте те, которые отмечены в POST к моему PHP-коду. Есть ли лучший способ – лучший способ сделать это, возможно, просто отправил весь массив checkboxes в POST и обработал на PHP, чтобы узнать, кто его проверил?
Заранее благодарю за идеи / предложения …
Да, заказ гарантирован.
В спецификации указано
Методы
querySelectorAll()на интерфейсах Document, DocumentFragment и Element должны возвращать NodeList, содержащий все соответствующие узлы Element в поддеревах узла контекста, в порядке документа . Если нет соответствующих узлов, метод должен возвращать пустой NodeList.
то есть элементы будут возвращены в том порядке, в котором они отображаются в документе
Если флажки добавлены, лучшим способом получить эти элементы будет отслеживание их при вставке.
Кроме этого, их можно будет обернуть в другой элемент с идентификатором или классом или просто предоставить новые флажки классу
var new_boxes = document.querySelectorAll('.new_boxes');
Обычно вы просто отправляете форму, и отмеченные поля будут отправляться автоматически.
Если вы отправляете данные с помощью ajax, вы можете получить отмеченные флажки с помощью селектора атрибутов
var boxes = document.querySelector('input[type="checkbox"][checked]');