(缓慢地)在WordPress中制作弹出窗口

Question

。。希望有人能帮上忙。

我正在为我的WordPress站点创建我自己的弹出功能。

以下代码的许多部分都是从网络上收集的，它们都可以正常工作。

有了它，我可以在html页面上选择几个帮助链接，然后在屏幕上打开一个弹出式窗口，每个弹出式窗口都有不同的内容。

正如我所说的，它可以工作，但不是很好，因为我有一个性能问题--我似乎无法确定。

主要:我实际上可以看到包含的文件正在填充，屏幕上只有短暂的延迟，但我可以看到它。

结论:有些地方不对劲。

也许你们中最优秀的程序员中的一位可以通过一个有经验的眼睛看代码，..然后指出弹出的任何东西？-或者不是！

背景：- /* css - js是两个都在主题目录路径之外的目录，都在工作。在我的functions.php文件中，我将jquery-ui.css放入页脚。经过反复试验，我现在将jquery-ui-min.js文件放在头文件中。顺便说一句:我没有使用版本号，它们只是出于习惯。我在下面的示例中使用了true - default，只是为了演示它们之间的区别。*/

wp_enqueue_style( 'jquery-effects', get_template_directory_uri( __FILE__ ) . '/css/jquery-ui.css' , array(),  '1.0.0',  true );
wp_enqueue_script( 'jquery-core-ui', get_template_directory_uri( __FILE__ ) . '/js/jquery-ui-min.js', array( 'jquery', 'jquery-ui-dialog' ), '1.0.0',  false );

- !>-在我的网页上，我有一个用来接受文件输入的iFrame:的Div。->

<div id="somediv" title="&equiv; [ POPUP ] &equiv;" style="display:none;">
    <iframe id="thedialog" width="100%" height="100%" ></iframe>
</div>

CSS:- /*我只是在使用jquery-ui.css文件中常见的ui-dialog类。*/

.ui-dialog {
    position: fixed;
    top: 0;
    left: 0;
    padding: .2em;
    outline: 0;
    background: blue; 
}

JS:- //这是我使用的js代码。

jQuery( document ).ready( function( $ ) 
{
    $( ".trigger" ).click( function ()
    {
        // The code below constructs a clean path to my WordPress page.
        // It is saved under a '/cuttings/' parent, and it works ..
        
        var submitUrl = document.location.origin + '/cuttings/' +  $(this).attr("href");       
        $("#thedialog").attr('src',  submitUrl );        
        $("#somediv").dialog(
        {  
            width: 500,
            height: 500,
            modal: true,
            close: function () 
            {
                $("#thedialog").attr('src', "about:blank");
            }           
        });
        return false;
    });   
});

/*我用WordPress构建了一个完全空白的模板，如下所示。*/

<?php
/* 
Template Name: WordPress Blank
*/
if ( have_posts() ) : while ( have_posts() ) :     
        the_post();
        the_content();
     endwhile; 
else: 
    echo '<p>Nothing Found!</p>';
endif
?>

它可以工作，只是输出WordPress页面的内容而不进行格式化。另外:存储在/cuttings/下的WordPress帮助页都使用此模板保存。

正如我所说的:除了在填写iFrame弹出窗口时出现的轻微延迟之外，一切都像预期的那样工作。

那么，任何人都能看到一个问题(？)

Answer 1

它确实很慢，但如果submitUrl没有'/‘结尾，我看到每次点击都会有2个请求，第一个总是失败，状态为301临时移动。非常奇怪。