Question

我正在尝试将Jquery脚本的以下部分仅运行一次

$(this).siblings('.youtubevideo').find("iframe").prop.one("src", function(){
    return $(this).data("src");
});

我只需要运行一次该部分，因为每当单击该元素时，其余的脚本都需要运行。

完整的脚本是：

<script>
  $(document).ready(function() {
    $(".youtubebbcode_button").off('click').click(function() {
      $(this).siblings('.youtubevideo').slideToggle("medium");
      $(this).siblings('.youtubevideo').css("display","inline-block");
      $(this.parentNode).toggleClass("youtubebbcode_open");
      $(this).siblings('.youtubevideo').find("iframe").prop("src", function(){
        return $(this).data("src");
      });
    });
  });
</script>

此外，此脚本位于论坛中的BBCode内部，因此带有脚本的元素将在给定主题中重复多次。

Answer 1

您只能使用.one()来触发事件一次而不是属性分配。

添加对属性的检查，考虑最初src为空。

var $iframe = $(this).siblings('.youtubevideo').find("iframe");
if(!$iframe.prop('src').length){
    $iframe.prop("src", function(){
        return $(this).data("src");
    });
}

或只是，

...
$iframe.prop("src", function(){
    var src = $(this).prop("src");
    return src.length? src : $(this).data("src");
});
...

注意：第二个选项会再次渲染iframe。喜欢第一个。

Answer 2

您可以检查$(document).ready(function() { $(".youtubebbcode_button").click(function() { $(this).siblings('.youtubevideo').slideToggle("medium"); $(this).siblings('.youtubevideo').css("display","inline-block"); $(this.parentNode).toggleClass("youtubebbcode_open"); var iframe = $(this).siblings('.youtubevideo').find("iframe") if(!iframe.attr("src").trim()) { iframe.attr("src", function() { return $(this).data("src"); }); } }); });属性，如果它是空的或未分解的，则执行您的代码。

00 00 00 19

Answer 3

您可以将其置于以下状态：

{{1}}

它将确保SRC属性是未定义还是空白，然后才进入执行。

Jquery：.One（）方法实现问题

3 个答案: