2012-01-23 31 views
0

問題:JQTransform和驗證碼不打漂亮

我在哪裏,我想用JQTransform迅速獲得一個漂亮的形式聯繫人頁面的網站工作。此外,爲了避免客戶變得垃圾,我決定添加reCAPTCHA。我遇到了文本框的JQTransform樣式問題,導致reCAPTCHA中的元素被移位。

這似乎是問題的類型,將有一個簡單的修復,但我掙扎了一段時間。

我試過了解決方案: JQTransform - Exclude an element from styling?

這並沒有解決這個問題,也做了一些其他的答案,「你怎麼做JQTransform停止JQTransforming一個元素?」題。

什麼產生了有用的結果是增加:

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

這改變了驗證碼,以看起來形式更好反正格式。但它留下了2個文本框樣式。一個是默認的默認文本框,另一個是JQTransform圓角,在懸停/焦點文本框中亮藍色。

然後我說:

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

並且這會改變該驗證碼有文本框的樣式。現在文本框看起來像表單的其他輸入。我對結果很滿意。

(我知道你現在問:「那你爲什麼在這裏?」)

問題:

有沒有辦法有JQTransform忽略任何輸入,複選框,等那是在<form></form>通過包裝在一個div?

如果我想使用JQTransform與其他一些插件在未來,我希望能夠只將它放在一個DIV,如:

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

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

這樣我就不必擔心代碼帶入表單的情況,它會工作並且看起來像預期的那樣。這就是抽象的概念,對吧?因此,如果我想用另一個選項切換reCAPTCHA,我所做的只是替換printCaptchaPlugin()函數中的代碼,並且對於使用它的任何表單,所有函數都應該是培根(良好)。

回答

0

嗯,我做了一個新的圖書館 - csTransPie - 使其基於jqtransform - jqtransform是一個偉大的圖書館,但它確實有很多問題

我創建的規則輸入字段(CSS樣式)和你贏了」噸有這些問題

https://github.com/pkoretic/csTransPie

這是一個進展中的工作,但即使是現在,它比jqtransform更好(超過CSS的一半改寫,很多bug解決了,乾淨的CSS ...)

現在你只需要一個類就可以使用它!

所有建議都歡迎!

0

很抱歉,如果這是不好的形式堆積在一個古老的回答的問題,但我發現這個,因爲我有同樣的問題。

我不想另一個庫添加到我的項目,所以我修改了jqtransform.js包括在文本區域處理這條線(線221-ISH)

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

然後我就不得不在jqtransformIgnore類添加到reCAPTCHA的DIV ...

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

...這奏效了!