WordPress中的BXSlider - javascript

所以我不想使用该插件，因为我想控制此滑块。我在不利用样式和js文件时遇到了问题。我通过函数文件调用它们，这些文件位于主题内的CSS和JS文件夹中。

这是使用jquery调用js的函数。

function theme_name_scripts() {
    wp_enqueue_script( 'bxslider', get_template_directory_uri() . '/js/jquery.bxslider.js', array(), '1.8.2', true );
}

add_action( 'wp_enqueue_scripts', 'theme_scripts' );

同样，这里是css（除了bxslider以外，所有功能都可以使用）

function theme_styles () {
    wp_enqueue_style('normalize', get_template_directory_uri() . '/css/normalize.css' );
    wp_enqueue_style('grid', get_template_directory_uri() . '/css/grid.css' );
    wp_enqueue_style('main', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style('social', get_template_directory_uri() . '/css/webfonts/ss-social.css' );
    wp_enqueue_style('social', get_template_directory_uri() . '/css/jquery.bxslider.css' );

}

add_action( 'wp_enqueue_scripts', 'theme_styles');

我将滑块直接放置到front-page.php中，如下所示：

        <ul class="bxslider">
  <li><img src="/images/pic1.jpg" /></li>
  <li><img src="/images/pic2.jpg" /></li>
  <li><img src="/images/pic3.jpg" /></li>
  <li><img src="/images/pic4.jpg" /></li>
</ul>





  <script>
jQuery(document).ready(function() {
jQuery('.bxslider').bxSlider({
  adaptiveHeight: true,
  mode: 'horizontal',
  captions: true,
  auto: true,
  useCSS: true,
  easing: 'ease-in',
  pager: false
});
});
</script>

我也想显示帖子而不是硬编码图像，所以这是我正在使用的php：

<?php
$content = '<ul class="bxslider">';
$loop = new WP_Query( array( 'post_type' => 'your_post_type', 'posts_per_page' => 10, 'post_status' => 'publish', 'orderby' => 'date', 'order' => 'DESC' ) );
    while ( $loop->have_posts() ) : $loop->the_post();
        $thumb_id = get_post_thumbnail_id();
        $thumb_url = wp_get_attachment_image_src($thumb_id,'full', true);
        $content .= '<li><a href="';
        $content .= get_permalink();
        $content .= '"><img src="';
        $content .= $thumb_url[0];
        $content .= '" alt="';
        $content .= get_the_title();
        $content .= '" /></a></li>';
    endwhile;
$content .= '</ul>';
echo $content;
?>

我只需要看一下这里似乎失败的地方？

参考方案

从您的评论看来，bxslider js似乎早于jQuery。

为了解决此依赖关系问题，WordPress wp_enqueue_script函数具有一个名为$ deps的参数，因此请尝试以下代码：

function theme_name_scripts() {
    wp_enqueue_script( 'bxslider', get_template_directory_uri() . '/js/jquery.bxslider.js', array('jquery'), '1.8.2', true );
}

add_action( 'wp_enqueue_scripts', 'theme_scripts' );

有关更多信息，请参见：http://codex.wordpress.org/Function_Reference/wp_enqueue_script

粗糙的Unicode->没有CLDR的语言代码？ - javascript

我在写字典应用。如果用户键入Unicode字符，我想检查该字符是哪种语言。例如字 - returns ['zh', 'ja', 'ko'] العربية - returns ['ar'] a - returns ['en', 'fr', …

提交初始化后删除某些帖子数据 - javascript

在初始化提交之后但在将数据发送到处理页面之前，是否可以过滤$ _POST表单数据？我想象过程的方式：提交->收集$ _POST数据->发送数据我想做的事：提交->收集$ _POST数据->删除某些元素->发送数据这样就不必更改处理页面以过滤掉不希望接收的元素了吗？ javascript大神给出的解决方案当然可以，您可以在JS …

打印二维阵列 - javascript

我正在尝试打印子元素。在this example之后。怎么做？。$myarray = array("DO"=>array('IDEAS','BRANDS','CREATIVE','CAMPAIGNS'), "JOCKEY"=>a…

使用php重新加载内容 - javascript

在对网站进行编程时，我以前使用过此代码，它可以完美工作，但是现在当我想使用一些Flash部件时，每次单击链接时，它都会重新加载所有网站。源代码： <!DOCTYPE html> <html> <head> <title>Hot King Staff</title> <meta charset=…

尽管刷新，jQuery格式仍未应用于Ajax数据 - javascript

我正在通过GET响应消息从服务器（php文件）的可折叠内部加载列表视图。但是，尽管刷新了jQuery元素，但jQuery格式并未应用于添加的HTML。我的页面在这里：http://i.cs.hku.hk/~hsbashir/Project_Work/events/events.htmlHTML代码（仅相关代码）<script> lastRecor…

WordPress中的BXSlider - javascript

腾讯的同事天天给我安利让我看《三体》，说马化腾和雷军也在…