Question

在Flask框架的一页上，我想在用户输入后显示弹出消息

我创建了一个带有锚点的css弹出窗口，但在用户在python脚本中输入用户名后，我无法调用该锚点。

我敢肯定有办法，但我缺少一些东西。我试图在我的Python脚本的不同部分调用anchor，但是到目前为止我没有成功

HTML：

<div id="popup1" class="overlay">
    <div class="popup">
        <h2>Here i am</h2>
        <a class="close" href="#">&times;</a>
        <div class="content">
            Great success!
        </div>
    </div>
</div>

CSS：

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
 }

 .popup {
   margin: 70px auto;
   padding: 20px;
   background: #fff;
   border-radius: 5px;
   width: 30%;
   position: relative;
   transition: all 5s ease-in-out;
 }

 .popup h2 {
   margin-top: 0;
   color: #333;
   font-family: Tahoma, Arial, sans-serif;
 }
 .popup .close {
   position: absolute;
   top: 20px;
   right: 30px;
   transition: all 200ms;
   font-size: 30px;
   font-weight: bold;
   text-decoration: none;
   color: #333;
 }
  .popup .close:hover {
    color: #06D85F;
  }
 .popup .content {
     max-height: 30%;
     overflow: auto;
   }

Python：

 @app.route('/game', methods = ["GET","POST"])
 def game():
data = []
global riddle_number 
global user_correct 
global user_wrong 


with open ("data/riddles.json", "r") as jason_data:
    data = json.load(jason_data)
if request.method == "POST":
    #popup1
    user_answer.append(request.form["answer"])
    if user_answer [-1] == data[riddle_number]["answer"]:
        riddle_number += 1
        user_correct += 1
    else:
        user_wrong += 1
    print (riddle_number, user_correct, user_wrong)
return render_template("game_page.html", user_list = user_list, riddles_data = data, user_answer=user_answer, riddle_number=riddle_number,
user_correct=user_correct, user_wrong=user_wrong)

用户输入了如何在Flask中显示弹出消息后

0 个答案: