Question

我有一个简短的jQuery函数，负责更改背景。问题是，如果我再次单击该按钮，它只会跳过整个过渡并开始下一个过渡。我想在这里做的是更改按钮ID直到转换结束，因此用户将无法跳过它。

JS

function changeBackground(div, arrowLeft, arrowRight, array, i){
  $(arrowLeft).attr("id", "#arrow-left-wait");
  $(arrowRight).attr("id", "#arrow-right-wait");
  $(div).css("background-image", `url(img/${backgrounds[i]})`);
  $(div).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend',
  function(){
    $("#arrow-left-wait").attr("id", arrowLeft);
    $("#arrow-right-wait").attr("id", arrowRight);
  });
  return;
}

CSS

.text{
  min-height: 500px;
  background-image: url("../img/background_1.jpg");
  background-size: cover;
  text-align: center;
  color: white;
  transition: background-image 1500ms ease-in;
  -webkit-transition: background-image 1500ms ease-in;
  -ms-transition: background-image 1500ms ease-in;;
}

Answer 1

您甚至不需要jQuery，只需在<script>元素中将以下代码添加到您的文件中：

＆＃13;

document.getElementById('this').id = 'changed';

＆＃13;

<div id="this">
</div>

＆＃13;

这会将<div id="this">的ID更改为<div id="changed">！

询问您是否需要更详尽的解释，如果您愿意，我可以将其发布在我的网站上。

JBDouble05

转换结束时jQuery更改id

1 个答案: