0

更新 Flexslider 有一堆回调空间可供使用，这使得这成为可能。

after: function(){},            //Callback: function(slider) - Fires after each slider animation completes

感谢大家

LIVE CODE：
我上传了用于调试的实时代码；制作一个jsfiddles会相当困难。

问题： 函数 fetchTitle() 获取上一个图像标题而不是最新的？

说明：我有一个函数falled，它fetchTitles()从flexslider的活动幻灯片中获取一个标题标签并将其放入一个varibletargetTitle中。然后替换h1.head_line为targetTitle

脚本：（从完整脚本配对下来，请查看完整的实时代码）

 function fetchTitles() {
       var targetTitle = $('.flex-active-slide').find('img').attr('title');

        $('.head_line').text(targetTitle);

    }

HTML

  <li class="flex-active-slide">
    <article class="active_work" title="Facebook + Like Pillow">
      <figure> <img title="Facebook + Like Pillow" src="asset/img/1600/slide1_1600.jpg" />
        <figcaption class="sliderCaptions">
          <h1>
            <div class="animate_text"></div>
            <a href="https://plus.google.com/104865624796200130935/" ><span>Author:</span> Matthew Harwood</a></h1>
        </figcaption>
      </figure>
      <section class="article_post"></section>
    </article>
  </li>

补充资料：

  • 如果您单击链接两次，您会看到标题会自行更新。
  • 即使有准备就绪，文档准备就绪上的提取标题也会出现无法识别.flex-active-slide。
  • 脚本位于源代码的底部script2.js
4

3 回答 3

1

改用$.prop：

var targetTitle = $('.flex-active-slide').find('img').prop('title');

属性和属性之间的区别在特定情况下可能很重要。在 jQuery 1.6 之前，该.attr()方法有时会在检索某些属性时考虑属性值，这可能会导致行为不一致。从 jQuery 1.6 开始，该.prop()方法提供了一种在检索属性的同时显式检索属性值的方法.attr()。

于 2012-07-11T19:43:16.967 回答
1

确实是时间问题。如果我引入 setTimeout，问题就消失了

function fetchTitles() {
       setTimeout(function()
       {
            var targetTitle = $('.flex-active-slide').find('img').attr('title');

            $('.head_line').text(targetTitle);

       },200);
    }
于 2012-07-11T19:55:01.313 回答
1

看起来该类直到幻灯片动画完成后才更新，但 fetchTitles 在您单击时立即运行，因此具有“flex-active-slide”类的图像仍然是前一个图像。

您可能希望查看在回调函数中运行 fetchTitles，以便它在幻灯片完成后运行。

于 2012-07-11T19:57:42.873 回答