dos

Public/static/js/common.js

@@ -97,7 +97,7 @@ $(document).ready(function () {
     //
     $('.page1 .btn-next').on('click', showFlagPage);
     //换一换按钮点击
-    $('.flag-page .btn-change').on('click', randomFlag);
+    $('.flag-page .btn-change').on('click', changeFlag);
     //选择flag
     $(document).on('click', '.flag-page .flag-block', addFlag);
     //自定义flag
@@ -132,8 +132,19 @@ function showFlagPage() {
 
 }
 
+function changeFlag() {
+    $('.flag-block').fadeOut(300);
+    setTimeout(function () {
+        let flagArr = randomFlagArr();
+        for (let i = 0; i < 6; i++) {
+            $('.flag' + (i + 1) + ' span').text(flag[flagArr[i]]);
+        }
+        $('.flag-block').fadeIn(300);
+    }, 300);
+}
+
 function randomFlag() {
-    // $('.flag-frame').html('');
+    $('.flag-frame').html('');
     let flagArr = randomFlagArr(6);
     for (let i = 0; i < flagArr.length; i++) {
         createItem(flag[flagArr[i]], i + 1);
@@ -168,11 +179,6 @@ function createItem(flag, no) {
     let item = flagTemplate.clone();
     item.find('.flag-no').text(no);
     item.find('.flag-text').append('<span>' + flag + '</span>').addClass('flag' + no);
-    if (!first) {
-        first = false;
-        $('.flag-block').fadeOut(300).delay(300).remove();
-        item.find('.flag-line,.flag-no,.text-bottom').css('animation', 'none 0 ease 0 1 normal').delay(300).fadeIn(300);
-    }
     $('.flag-frame').append(item);
 }