如何防止jQuery UI对话框停止其他脚本？

我使用jQuery UI的对话框选项来呈现包含验证码的弹出式注册表单。如何防止jQuery UI对话框停止其他脚本？

当我在另一页上呈现注册表单时，验证码显示得很好，但不会显示在对话框弹出窗体上。

我检查了HTML，无论出于何种原因，只有验证码的'noscript'代码块才将其添加到页面中。

有没有关于jQuery UI对话框我错过了，导致它干扰其他脚本呢？

这里的窗体代码：

<%= error_messages_for(@user) %> 
<%= form_for(:user, :url => users_path, :remote => true, :html => {:id => 'create_user_form'}) do |f| %> 
    <div class="in-field"> 
     <%= f.label(:first_name) %> 
     <%= f.text_field(:first_name) %> 
     <div class="field_valid"></div> 
    </div> 
    <div class="in-field"> 
     <%= f.label(:last_name) %> 
     <%= f.text_field(:last_name) %> 
     <div class="field_valid"></div> 
    </div> 
    <%= f.date_select(:birthday, :start_year => 1912) %><br /> 
    image stuff<br /> 
    <div class="in-field"> 
     <%= f.label(:username) %> 
     <%= f.text_field(:username) %> 
     <div class="field_valid"></div> 
    </div> 
    <div class="in-field"> 
     <%= f.label(:password) %> 
     <%= f.password_field(:password) %> 
     <div class="field_valid"></div> 
    </div> 
    <div class="in-field"> 
     <%= f.label(:password_confirmation) %> 
     <%= f.password_field(:password_confirmation) %> 
     <div class="field_valid"></div> 
    </div> 
    <div class="in-field"> 
     <%= f.label(:email) %> 
     <%= f.text_field(:email) %> 
     <div class="field_valid"></div> 
    </div> 
    <div class="in-field"> 
     <%= f.label(:email_confirmation) %> 
     <%= f.text_field(:email_confirmation) %> 
     <div class="field_valid"></div> 
    </div> 
     <div id="test"> 
     <script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfLRdMSAAAAAJ2SYOMT2nNhu2aMw6s3XtD1s5Id"></script> 
      </div> 
    </div> 
    <br /> 

<%= check_box_tag('eula', 'accepted', false) %> I agree to the <%= link_to('terms of service') %> and <%= link_to('privacy policy') %>.<br /> 
<%= f.submit 'Submit' %> 
<% end %>

而这里的UI弹出代码：

$('.modal-dupe').click(function(){ 
var url = this.href; 
$('#modal').remove(); 
var dialog = $('<div id="modal" style="display:none" class="loading"></div>').prepend('#barhappy_container'); 
dialog.load(url, function(){ 
    dialog.dialog({ 
     modal: true, 
     draggable: false, 
     position: 'center', 
     dialogClass: 'no-title', 
     width: 'auto', 
     height: 'auto', 
     resizable: false, 
     open: function(){ 
       $.getScript('/assets/modal/in-modal-open.js'); 
     }, 
     close: function(event, ui){ 
      dialog.remove(); 
     } 
    }); 
}); 
return false;

}）;

来源

2012-06-25 Adam Templeton

我们可以猜测手动创建的Recaptcha或者我们可能会看到你的代码，请。 –

根据您的代码，您可能已在文档加载时初始化对话框，并在稍后进行渲染。这意味着您的对话DOM完全在加载时形成，并且在此之后进行的任何编辑都不会反映出来。这只是一个猜测 - 但正如Mark上面提到的那样，请张贴您的代码，以便我们进一步提供帮助。 – ganeshk

我很抱歉。我已经添加了我的代码... –

事实证明，jQuery dialog（）在打开时可以接受一个函数参数，我通过$ .getScript（）调用必要的JavaScript代码。

可以使用

$('SELECTOR FOR AN EMPTY DIV').each(function() { 
    Recaptcha.create('YOUR PUBLIC KEY', this 
});

来源

2012-06-27 00:20:20

如何防止jQuery UI对话框停止其他脚本？

回答

相关问题