Question

如果验证正确并且正在显示旋转，但是过渡很快，则尝试将其移至另一页，旋转看起来不正确。如何保持旋转3秒并将其移至下一页？

   <a type="submit" href="next-to" class="btn submit">
      Next page
      <span class="fa fa-rocket"></span>
    </a>

在JQuery中，如果验证正确，它将在旋转中添加一个加载器类以使其加载并将其移至下一个。

  if (validate()) {
    $('.fa').addClass('loader'); <!-- showing the loading at least 3 seconds
  }

Answer 1

有两种方法，您可以如下使用

方法1：

private fun addToFavorite() {
    try {
        database.use {
            insert(
                Favorite.DATA_FAVORITE,
               Favorite.ID_EVENT to id_event,
                Favorite.DATE to tanggaltandingdet.text,

                // home team
               Favorite.HOME_ID to idhome,
                Favorite.HOME_TEAM to timkandangdet.text,
                Favorite.HOME_SCORE to skorkandangdet.text,
                Favorite.HOME_GOAL_DETAILS to cetakgolkandang.text,
                Favorite.HOME_LINEUP_GOALKEEPER to kiperkandang.text,
                Favorite.HOME_LINEUP_DEFENSE to bekkandang.text,
                Favorite.HOME_LINEUP_MIDFIELD to midkandang.text,
                Favorite.HOME_LINEUP_FORWARD to strikerkandang.text,
                Favorite.HOME_LINEUP_SUBSTITUTES to cadangankandang.text,
            //    Favorite.HOME_TEAM_BADGE to urllogokandang.text,

                // away team
                Favorite.AWAY_ID to idaway,
                Favorite.AWAY_TEAM to timtandangdet.text,
                Favorite.AWAY_SCORE to skortandangdet.text,
                Favorite.AWAY_GOAL_DETAILS to cetakgoltandang.text,
                Favorite.AWAY_LINEUP_GOALKEEPER to kipertandang.text,
                Favorite.AWAY_LINEUP_DEFENSE to bektandang.text,
                Favorite.AWAY_LINEUP_MIDFIELD to midtandang.text,
                Favorite.AWAY_LINEUP_FORWARD to strikertandang.text,
                Favorite.AWAY_LINEUP_SUBSTITUTES to cadangantandang.text
            //    Favorite.AWAY_TEAM_BADGE to urllogotandang.text

            )
        }

        toast ("Data Telah Di Simpan"  )
    } catch (e: SQLiteConstraintException) {
        toast("Error: ${e.message}")
    }
}

function fnshowLoader(obj) {
  this.event.preventDefault();
  if (true) {     //If true return by validate() function
    $('.fa').addClass('loader');

    var url = obj.getAttribute("href"); // store anchor href
    setTimeout(function() {
      window.location = url;
    }, 2000);
  }

}

方法2：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a type="submit" href="next-to" class="btn submit" onclick="fnshowLoader(this)"> 
      Next page
      <span class="fa fa-rocket"></span>
    </a>

$(document).ready(function() {

  $('.nextPressed').click(function(e) {
    e.preventDefault()
    if (true) { // If true return by validate() method
      $('.fa').addClass('loader');
      var url = this.href;
      setTimeout(function() {
        window.location = url;
      }, 2000);
    }
  });
});

Answer 2

像这样使用setTimeout：

if (validate()) {
  $('.fa').addClass('loader'); <!-- showing the loading at least 3 seconds

  setTimeout(function() {
    return;
  }, 5000);
}

此外，不建议使用“ fa”类，因为它会将“ loader”类添加到“ fa”类的所有元素中。更好的方法是$('.submit.fa-rocket')

一定时间后转到下一页JQuery

2 个答案: