JQTransform и reCAPTCHA не играют хорошо - PullRequest
Новая
       19

JQTransform и reCAPTCHA не играют хорошо

0 голосов
/ 23 января 2012

Проблема:

Я работаю над сайтом, на котором я хотел использовать JQTransform, чтобы быстро получить красивую форму для страницы контактов. Кроме того, чтобы клиент не стал мусором, я решил добавить reCAPTCHA. Я столкнулся с проблемой стилей JQTransform для текстового поля, в результате чего элементы в reCAPTCHA были смещены.

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

Я попробовал решение по адресу: JQTransform - исключить элемент из стиля?

Это не решило проблему, а также несколько других ответов на вопрос «Как заставить JQTransform остановить JQTransforming элемента?» вопрос.

Что дало полезные результаты, так это добавление: 

    <script type="text/javascript">
            var RecaptchaOptions = {
                theme: 'clean'
            };
    </script>

Это изменяет reCAPTCHA на формат, который в любом случае выглядит лучше в форме. Но это оставляет 2 стиля текстового поля. Одно из них является вашим обычным текстовым полем по умолчанию, а другое под ним - закругленный угол JQTransform, светло-голубой на текстовом поле наведения / фокусировки.

Тогда я добавил: 

    $(function () {
        $( "#recaptcha_response_field" ).attr('style', 'border: 0px; padding: 5px; solid #3c3c3c; width: 302px;');
    });

и это изменяет стиль, который reCAPTCHA имеет для текстового поля. Теперь текстовое поле выглядит как другие входные данные формы. Я очень доволен результатом.

(Я знаю, что вы сейчас спрашиваете: «Тогда почему вы здесь?»)

Вопрос:

Есть ли способ заставить JQTransform игнорировать любые входные данные, флажки и т. Д., Которые есть в <form></form>, заключая их в div?

Если в будущем я захочу использовать JQTransform с каким-либо другим плагином, я бы хотел просто вставить его в div, например: 

    <div class="donot-jqtransform">
        <?php
            echo printCaptchaPlugin();
        ?>
    </div>

или 

    <div class="donot-jqtransform">
        <%= PrintPasswordValidationPlugin() >
    </div>

Таким образом, мне не нужно беспокоиться о том, что код вводит в форму, и он будет работать и выглядеть так, как задумано. Это идея иметь абстракцию в первую очередь, верно? Поэтому, если я хочу отключить reCAPTCHA с помощью другой опции, все, что я делаю, это заменяю код в функции printCaptchaPlugin (), и все должно быть беконом (хорошо) для любой формы, которая его использует.

Ответы [ 2 ]

0 голосов
/ 05 января 2015

Извините, если это плохая форма, чтобы навалиться на старый ответ на вопрос, но я нашел это, поскольку у меня была та же проблема.

Я не хотел добавлять другую библиотеку в свой проект, поэтому я исправилjqtransform.js для включения этой строки в обработчик TextArea (строка 221-ish) 

if (textarea.parents().hasClass('jqTransformIgnore')) { return; }

Затем мне просто нужно было добавить класс jqtransformIgnore в div recaptcha div ... 

<div class="g-recaptcha jqTransformIgnore" data-sitekey="blahblahblah"></div>

... и это помогло!

0 голосов
/ 31 января 2012

ну, я сделал новую библиотеку - csTransPie - основываясь на jqtransform - jqtransform - отличная библиотека, но у нее действительно много проблем

Я создаю обычные поля ввода (в стиле CSS), и у вас не будет таких проблем

https://github.com/pkoretic/csTransPie

Это работа, но даже сейчас она лучше, чем jqtransform (переписано более половины css, исправлено много ошибок, чистая css…)

теперь вы можете использовать его для каждого элемента только с одним классом!

все предложения приветствуются!

...