删除Recaptcha的iframe上的frameborder属性

时间:2014-01-28 09:43:53

标签: javascript html iframe recaptcha w3c-validation

我需要知道在哪里可以更改Google重新访问代码的这一行代码:


iframe元素上的frameborder属性已过时。我想在iframe中将frameborder =“0”更改为border:none;。

验证时会出现错误,说“iframe元素上的frameborder属性已过时。请改用CSS。”。

有关如何解决此问题的任何想法?

 <dd class="auto recaptcha">
    <p class="cap">ReCAPTCHA entry is for testing whether you are a human visitor and to prevent automated spam submissions.</p>
    <div class="recaptcha-item">
      <script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN"></script>

<noscript>
    <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN" height="300" width="500" frameborder="0"></iframe><br/>
    <textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
    <input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
</noscript>                </div>

              <p><sup class="required">*</sup> = Required Fields</p>
    </dd>

Screenshot of wf4's answer

wf4答案的屏幕截图

2 个答案:

答案 0 :(得分:2)

答案在你的编辑中。有一个脚本src = http://www.google.com/recaptcha/api/challenge将使用javascript在您的网站中创建iframe,如果脚本不可用,将使用noscript位。所以,如果你删除

<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN"></script>

<noscript> </noscript>代码,但不是内容,然后您可以删除您不想要的frameborder="0"。所以你的完整代码是:

 <dd class="auto recaptcha">
<p class="cap">ReCAPTCHA entry is for testing whether you are a human visitor and to prevent automated spam submissions.</p>
<div class="recaptcha-item">


<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN" height="300" width="500"></iframe><br/>
<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
<input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
            </div>

          <p><sup class="required">*</sup> = Required Fields</p>
</dd>

对于样式,这也可以使用脚本添加,这应该是您需要包含在head

中的内容
<style type="text/css">
.recaptchatable td img{display:block}.recaptchatable .recaptcha_r1_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') 0 -63px no-repeat;width:318px;height:9px}.recaptchatable .recaptcha_r2_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -18px 0 no-repeat;width:9px;height:57px}.recaptchatable .recaptcha_r2_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -27px 0 no-repeat;width:9px;height:57px}.recaptchatable .recaptcha_r3_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') 0 0 no-repeat;width:9px;height:63px}.recaptchatable .recaptcha_r3_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -18px -57px no-repeat;width:300px;height:6px}.recaptchatable .recaptcha_r3_c3{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -9px 0 no-repeat;width:9px;height:63px}.recaptchatable .recaptcha_r4_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px 0 no-repeat;width:171px;height:49px}.recaptchatable .recaptcha_r4_c2{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -36px 0 no-repeat;width:7px;height:57px}.recaptchatable .recaptcha_r4_c4{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -214px 0 no-repeat;width:97px;height:57px}.recaptchatable .recaptcha_r7_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px -49px no-repeat;width:171px;height:8px}.recaptchatable .recaptcha_r8_c1{background:url('http://www.google.com/recaptcha/api/img/red/sprite.png') -43px -49px no-repeat;width:25px;height:8px}.recaptchatable .recaptcha_image_cell center img{height:57px}.recaptchatable .recaptcha_image_cell center{height:57px}.recaptchatable .recaptcha_image_cell{background-color:white;height:57px}#recaptcha_area,#recaptcha_table{width:318px!important}.recaptchatable,#recaptcha_area tr,#recaptcha_area td,#recaptcha_area th{margin:0!important;border:0!important;padding:0!important;border-collapse:collapse!important;vertical-align:middle!important}.recaptchatable *{margin:0;padding:0;border:0;font-family:helvetica,sans-serif;font-size:8pt;color:black;position:static;top:auto;left:auto;right:auto;bottom:auto}.recaptchatable #recaptcha_image{position:relative;margin:auto}.recaptchatable #recaptcha_image #recaptcha_challenge_image{display:block}.recaptchatable #recaptcha_image #recaptcha_ad_image{display:block;position:absolute;top:0}.recaptchatable img{border:0!important;margin:0!important;padding:0!important}.recaptchatable a,.recaptchatable a:hover{cursor:pointer;outline:none;border:0!important;padding:0!important;text-decoration:none;color:blue;background:none!important;font-weight:normal}.recaptcha_input_area{position:relative!important;width:153px!important;height:45px!important;margin-left:7px!important;margin-right:7px!important;background:none!important}.recaptchatable label.recaptcha_input_area_text{margin:0!important;padding:0!important;position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;background:none!important;height:auto!important;width:auto!important}.recaptcha_theme_red label.recaptcha_input_area_text,.recaptcha_theme_white label.recaptcha_input_area_text{color:black!important}.recaptcha_theme_blackglass label.recaptcha_input_area_text{color:white!important}.recaptchatable #recaptcha_response_field{width:153px!important;position:relative!important;bottom:7px!important;padding:0!important;margin:15px 0 0 0!important;font-size:10pt}.recaptcha_theme_blackglass #recaptcha_response_field,.recaptcha_theme_white #recaptcha_response_field{border:1px solid gray}.recaptcha_theme_red #recaptcha_response_field{border:1px solid #cca940}.recaptcha_audio_cant_hear_link{font-size:7pt;color:black}.recaptchatable{line-height:1!important}#recaptcha_instructions_error{color:red!important}.recaptcha_only_if_privacy{float:right;text-align:right}#recaptcha-ad-choices{position:absolute;height:15px;top:0;right:0}#recaptcha-ad-choices img{height:15px}.recaptcha-ad-choices-collapsed{width:15px;height:15px;display:block}.recaptcha-ad-choices-expanded{width:75px;height:15px;display:none}#recaptcha-ad-choices:hover .recaptcha-ad-choices-collapsed{display:none}#recaptcha-ad-choices:hover .recaptcha-ad-choices-expanded{display:block}
.recaptcha_is_showing_audio .recaptcha_only_if_image,.recaptcha_isnot_showing_audio .recaptcha_only_if_audio,.recaptcha_had_incorrect_sol .recaptcha_only_if_no_incorrect_sol,.recaptcha_nothad_incorrect_sol .recaptcha_only_if_incorrect_sol{display:none !important}
</style>

答案 1 :(得分:0)

好的,所以这是另一种解决方案......问题是“在Recaptcha的iframe上删除frameborder属性”。 这个问题必须是w3c验证器的结果。在您的代码中有一个脚本,它将HTML注入您的页面,这样做将包括样式内容所需的所有HTML和CSS。 我的第一个答案是删除此脚本并仅使用iframe标记中的<noscript>,但是,这不是问题。问题是<noscript>标签的内容,而不是实际的回弹。所以我的第二个答案是执行以下操作之一:

答:从frameborder="0"

中删除iframe
<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfaXscSAAAAAMcN5Mfvza9CyYfV7K5__BbQiPBN" height="300" width="500"></iframe>

这将解决验证问题。

B:如果在脚本不可用时您不想要未格式化的表单,请删除整个<noscript>部分。

还有其他一些尝试来设置iframe内容的样式,但是他们使用javascript,而现代浏览器在网站不属于同一域时不允许这样做。