将GetOption()变量拉入jQuery动态创建的html

时间:2013-05-06 作者:jchwebdev

我在网站主题页脚中有一个带有以下标记的页面:

<div id="modalpopup"><div id="inside"></div></div>
我在WP db中有一个变量,我可以通过GetOption() 我想把它塞进里面div#inside 通过jQuery进行页面加载。

当我以前做过AJAX时,用户总是点击按钮来引起帖子,但这有点不同,所以我有点卡住了。

我需要从db中检索该变量,将其发送到jQuery函数,然后在页面加载之前将生成的HTML呈现出来。

想法?

2 个回复
最合适的回答,由SO网友:s_ha_dum 整理而成

您仍然可以使用AJAX来实现这一点,除了不触发“单击”或“悬停”之类的事件,或者submit, 您可以启动Javascript函数jQuery(document).ready 相反这将在页面加载时立即执行。它不允许您在页面加载之前执行代码,但您不能在页面加载之前运行Javascript。Javascript在浏览器中运行客户端。必须加载页面才能实现这一点。

SO网友:Milo

这里有两种可能的解决方案-

Solution one 不是将模式标记硬编码到模板中,而是使用wp_footer 将其与数据一起插入的操作:

function wpa_wp_footer(){
    $someval = \'foo\'; // get_option results
    echo \'<div id="modalpopup"><div id="inside">\' . $someval . \'</div></div>\';
}
add_action( \'wp_footer\', \'wpa_wp_footer\' );
就个人而言,我会这样做,尽可能简单,保持主题不可知。

Solution two 更符合您的原始想法,并将数据获取到javascript中,以便您可以自己插入。但不是通过ajax单独请求数据,localize the script 在呈现页面时将数据打印到页面。

这是你的标准enqueue 用于向主题添加javascript,以及用于添加额外数据的本地化调用。

function wpa_scripts() {
    wp_enqueue_script(
        \'wpa_script\', // script handle
        get_template_directory_uri() . \'/js/script.js\',
        array(\'jquery\'),
        null,
        true
    );
    // do your get_option here to set whatever data you\'re passing
    $script_data = array(
        \'some_var\' => \'someval\'
    );
    wp_localize_script(
        \'wpa_script\', // the script handle enqueued above
        \'wpa_data\',
        $script_data
    );
}
add_action( \'wp_enqueue_scripts\', \'wpa_scripts\' );
然后在javascript中访问如下数据:

jQuery(\'#inside\').html( wpa_data.some_var );

结束

相关推荐

UPDATE_USER_META不适用于AJAX

我尝试将用户订阅保存在元数据变量中。该函数由AJAX调用。调用了AJAX,但前端的元数据似乎没有更新。代码如下:jQuery<script type=\"text/javascript\"> jQuery(document).ready(function($) { $(\'#tags_list a\').click(function(){ myid = $(this).parent(\"li\").attr(\'id\')