Не удается получить ввод: проверенная функция для работы

#html #css #checked

#HTML #css — код #проверено

Вопрос:

Я пытаюсь создать страницу продукта. Я хочу, чтобы, когда кто-то нажимал на кнопку «Купить», открывалось всплывающее меню. Я пытаюсь использовать Checkbox hack, чтобы заставить это работать. Однако я не могу этого сделать. Кнопка «Купить» успешно переключает флажок, но ввод [type=checkbox]:checked не работает. Пожалуйста, помогите. Мой код следует:

Я хочу, чтобы раздел sizemenu был скрыт и становился видимым, когда я нажимаю на кнопку купить. Я приношу извинения, если мой вопрос не очень ясен. Заранее благодарю.

Предварительный просмотр: http://codepen.io/anon/pen/mDqpw

ОБНОВЛЕНИЕ: уменьшено количество кода до минимума.

1. это много кодов.. публикуйте только ту часть, которую, по вашему мнению, вы не можете сделать основой для своего тестирования

2. Возможно, я ошибаюсь, но, похоже .sizemenu , в вашем HTML ее нет. Пожалуйста, сократите HTML и CSS до минимального значения, которое показывает проблему.

3. Самое главное, опубликуйте свой Javascript, который отвечает за это поведение.

4. Мне действительно очень жаль. Как мне сократить код, а затем опубликовать его снова?

5. Я понял, что я делал неправильно. Мой флажок находился в другом разделе, а sizemenu — в другом разделе. Следовательно, соседний селектор ~ не смог настроить таргетинг на sizemenu. Исправил это, сняв флажок снаружи, в разделе, который был рядом с sizemenu.

Ответ №1:

Вы устанавливаете этот стиль для самого флажка (элемента формы) или метки?

http://jsfiddle.net/tt66d/2/

 input[type="checkbox"]:checked   label {
    color: blue;
    font-weight: bold;    
}

<input type="checkbox" id="o1" name="products" value="option1">
<label for="o1">Option 1</label>

<input type="checkbox" id="o2" name="products" value="option2">
<label for="o2">Option 2</label>