当我通过 jQuery .load() 加载 tinyMCE 时浏览器冻结
Posted
技术标签:
【中文标题】当我通过 jQuery .load() 加载 tinyMCE 时浏览器冻结【英文标题】:Browser freeze when I load tinyMCE via jQuery .load() 【发布时间】:2012-07-18 18:28:46 【问题描述】:我遇到了一个问题,挣扎了好几个小时。我正在使用 jQuery load 加载一个包含 tinyMCE 及其脚本(wordpress)的 php 页面
$('.quickedit_form_' + parentID).load('<?php bloginfo('template_directory'); ?>/ajax/quickedit.php?id=' + parent.attr('id').replace('post-', ''), function()
tinyMCE.init(
skin: 'wp_theme'
);
$.scrollTo(parent, 800, offset: left: 0, top: -61);
);
还有我的 php 页面 (quickedit.php)
<?php
// include WordPress
require('../../../../wp-blog-header.php');
// get post
global $current_user;
$id = $_GET['id'];
$post = get_post($id);
if ($current_user->ID != $post->post_author)
wp_die(__('Unauthorized access.','sofa'));
?>
<h1 class="quickedit_h"><?php printf(__('Editing Post #%s','sofa'), $post->ID); ?></h1>
<label for="edit_title_<?php echo $id; ?>" class="quickedit_label"><?php _e('Title:','sofa'); ?></label>
<input type="text" name="edit_title_<?php echo $id; ?>" id="edit_title_<?php echo $id; ?>" value="<?php echo $post->post_title; ?>" class="quickedit_field" />
<label for="edit_type_<?php echo $id; ?>" class="quickedit_label"><?php _e('Post Type:','sofa'); ?></label>
<select name="edit_type_<?php echo $id; ?>" id="edit_type_<?php echo $id; ?>" class="quickedit_select">
<option value="text"<?php selected("text", sofa_post_type()); ?>><?php _e('Blog','sofa'); ?></option>
<option value="image"<?php selected("image", sofa_post_type()); ?>><?php _e('Image','sofa'); ?></option>
<option value="video"<?php selected("video", sofa_post_type()); ?>><?php _e('Video','sofa'); ?></option>
</select>
<div class="quickedit_save"><input type="button" value="<?php _e('Save','sofa'); ?>" class="button-secondary" /></div>
<?php
wp_editor( $post->post_content, 'edit_content_'.$id, $settings = array(
'wpautop' => true,
'media_buttons' => true,
'textarea_name' => 'edit_content_'.$id,
'textarea_rows' => 10,
'tabindex' => '',
'editor_css' => '',
'editor_class' => 'edit_content',
'teeny' => false,
'dfw' => false,
'tinymce' => true,
'quicktags' => true
));
?>
<div class="quickedit_save"><input type="button" value="<?php _e('Save','sofa'); ?>" class="button-secondary" /></div>
<?php wp_footer(); ?>
当我直接在浏览器中访问 quickload.php 时,一切都加载顺利,没有延迟或任何东西。但是当我通过 jQuery .load() 访问它时,tinymce 和按钮需要大约 15 秒才能加载,在 Firefox 和 chrome 中都尝试过冻结浏览器(用户无法与任何东西交互)。
任何人都可以告诉我为什么会发生这种情况,已经尝试了几个小时.. :(
注意:当我直接访问 quickedit.php 时,tinymce 加载得又快又好。从 jquery .load 函数调用时发生崩溃/冻结。
我需要有关可能导致此问题的任何指示吗?
【问题讨论】:
我遇到了与 .get() 相同的问题。通过我的调试器,它在为我加载 jquery.min.ui.js 文件时冻结 - 与异步无关。它只会冻结/缓慢加载页面上的第一个 .get() 请求,任何后续请求都会按预期响应。我认为这与我的代理服务器有关。 【参考方案1】:我会尝试使用 jQuery 的低级 ajax 接口:jQuery.ajax
jQuery(function($)
var ajax_url = '<?php bloginfo('template_directory'); ?>/ajax/quickedit.php?id=' + parent.attr('id').replace('post-', ''); //Included for readability
//Check if the elem is in the DOM, if so, load it via AJAX
if ($('.quickedit_form_' + parentID).length >0)
$.ajax(
url: ajax_url
complete: function ()
tinyMCE.init(
skin: 'wp_theme'
);
$.scrollTo(parent, 800, offset: left: 0, top: -61);
);
);
您可能遇到错误的原因是 jQuery.load 的多参数性质(加上我认为它已弃用...?)可能会导致同步(阻塞)请求。
【讨论】:
以上是关于当我通过 jQuery .load() 加载 tinyMCE 时浏览器冻结的主要内容,如果未能解决你的问题,请参考以下文章
通过 .load() 加载数据后使用 JQuery UI 的 sortable('serialize');
向html页面通过jquery的$.load加载html页面如何实现!急急急