如何正确实现自定义ajax

Question

12 浏览2023年5月8日

匿名的 2023年5月9日

0 Comments

为了在页面刷新或内容从页面加载到另一个页面时，保持logotext 和菜单

不被裁剪，我尝试实现了由@Buzinas（特别感谢）提供的解决方案。简单来说：

在 header.php中，我们有以下脚本：


    ...
    
    ...

以下的 jquery-ready.js 在 script-calls.php 中被注册/引入：

(function($){
var readyList = [];
// 存储对原始 ready 方法的引用。
var originalReadyMethod = jQuery.fn.ready;
// 覆盖 jQuery.fn.ready
jQuery.fn.ready = function(){
    var args = [].slice.call(arguments);
    if(args.length && args.length > 0 && typeof args[0] === 'function') {
      readyList.push(args[0]);
    }
    // 执行原始方法。
    originalReadyMethod.apply( this, args );
};
// 用于触发所有 ready 事件
$.triggerReady = function() {
  $(readyList).each(function(i, el) {
      try {
          el.apply(el);
      } catch(e) {
          console.log(e);
      }
  });
};
})(jQuery);

此外，在 page.php 中，我将 get_header() 和 get_footer() 函数替换如下：


get_queried_object_id();
        $sidebar = get_post_meta($id, 'sidebar_set', true);
        $sidebar_pos = get_post_meta($id, 'sidebar_position', true);
    }
?>
...

仍然存在一些问题，试图加载带有Revolution幻灯片或Visual Composer视差内容的页面，例如 Parallax 或 About us 页面。您可以使用此链接并导航到上述页面进行测试；测试仅在 Chrome 45.0.2454.101 m 64-bit/ Win7 中进行，尚未准备好用于 IE、Firefox、移动设备等。

关于行为：

Rev 幻灯片视差内容，将在第二次访问链接（主页或 Parallax 页面）时变得混乱；Visual Composer 视差内容（关于我们页面上的办公桌图片）在第一次访问链接后固定 - 刷新后将恢复正常；

菜单 mynewmenu.js 将记住会话状态，所以您需要关闭浏览器才能正确访问多个直接链接。

我收到了 Revolution 幻灯片支持团队的答复，他们告诉我：

对于 Ajax，最好的选择是将幻灯片的短代码添加到常规页面/文章中，然后幻灯片的 "init" 脚本将自动包含在幻灯片的 HTML 中。然后，当幻灯片的 HTML 从 DOM 中移除时，所有的 jQuery 事件也会被移除。所以，你只需要将幻灯片作为页面/文章内容引入，就不再需要为幻灯片编写任何自定义脚本。

不幸的是，我不知道如何将这个建议融入到我已经得到的解决方案中。

可能与 API 有关吗？我在 Revolution 幻灯片 / Visual Composer 页面上找到了这些信息。有什么想法吗？

0

2 答案

匿名的 · Answer 1 · 2023-06-21T15:49:40+00:00

问题的原因是用户想要正确实现一个自定义的ajax，但是他们遇到了困难。解决方法是使用Revolution Slider的支持团队提供的建议，即将滑块的短代码添加到常规页面/文章，并将滑块作为页面/文章内容引入。然后，根据需要在php（或javascript）中引用$_GET[]和/或$_POST[]数组元素。

感谢用户的反馈，他们将在有空的时候尝试这个解决方案。然而，问题在于使用Visual Composer时会出现相同的行为。

匿名的 · Answer 2 · 2023-09-24T18:24:34+00:00

问题的出现原因：在实现自定义ajax时，可能会出现以下问题：

1. 在主页模板中进行特定内容的服务，不需要对主页模板进行修改；

2. 需要在页面上运行Rev Slider的shortcode，或者Parallax的shortcode；

3. 在页面模板、functions.php等代码中使用do_shortcode()函数；

4. 在小工具中使用shortcode；

5. 在各处使用shortcode。

解决方法：

1. 可以使用wp_localize_script()函数将PHP变量传递给JavaScript文件；

2. 如果不使用wp_localize_script()函数，可以创建一个单独的页面，然后为该页面创建一个特定的模板，并将该页面的URL用作ajax的终点；

3. 如果需要在页面上运行Rev Slider的shortcode（以及Parallax的shortcode），可以在代码中使用do_shortcode()函数；

4. 如果需要在小工具中使用shortcode，可以参考链接：https://digwp.com/2010/03/shortcodes-in-widgets/；

5. 如果希望在各处使用shortcode，可以参考链接：http://stephanieleary.com/2010/02/using-shortcodes-everywhere/。

希望以上解决方法对你有帮助，感谢你的努力。希望你有时间尝试以上解决方案。