Показать сообщение после установки флажка - HTML Контактная форма - PullRequest
Новая
       2

Показать сообщение после установки флажка - HTML Контактная форма

0 голосов
/ 27 мая 2019

Я попытался выполнить шаги этой ссылки , но не могу заставить ее работать.

Я пытаюсь сделать так, чтобы в контактной форме, созданной в WordPress через HTML, если пользователь установил флажок, появилось что-то еще. Я реализовал код, который появляется в ссылке на моей веб-странице, и добавил CSS (не SCSS) к пользовательской странице CSS, которую позволяет Wordpress. Но даже если я думаю, что выполнил все правильные шаги, сообщение, которое должно появиться, только если флажок установлен, всегда отображается.

В приведенном примере я сократил его до 

<form name="Inscripción" method="POST" onsubmit="return" form_validation()="" action="../customer-details.php">. 
<input type="radio" name="choice-animals" id="choice-animals-dogs"><br>
<label for="choice-animals-dogs">I like dogs more</label><p></p>. 
<div class="reveal-if-active"> Anything you want in here. </div>
</form>

И CSS был добавлен 

.reveal-if-active {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
}
input[type="radio"]:checked ~ .reveal-if-active,
input[type="checkbox"]:checked ~ .reveal-if-active {
  opacity: 1;
  max-height: 100px; /* little bit of a magic number :( */
  overflow: visible;
}

Спасибо за любую помощь, которую вы можете оказать!

1 Ответ

0 голосов
/ 28 мая 2019

Я проверил ваш код, кажется, работает для меня. если код CSS не работает для вас. Вы можете использовать приведенный ниже код jquery для отображения сообщения на проверенном радио. 

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>
    jQuery(document).ready(function(){
        jQuery('.reveal-if-active').hide();
        jQuery('input[type="radio"]').change(function() {
            if (jQuery(this).is(':checked')) {
                jQuery('.reveal-if-active').show();
            }
        });

    });
</script>
</head>

<form name="Inscripción" method="POST" onsubmit="return" form_validation="" action="../customer-details.php">. 
<input type="radio" name="choice-animals" id="choice-animals-dogs"><br>
<label for="choice-animals-dogs">I like dogs more</label><p></p>. 
<div class="reveal-if-active"> Anything you want in here. </div>
</form>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...