userpage_post.html: update userpage_post.html.

2022-05-29 15:19:07 +08:00
1 changed files with 26 additions and 1 deletions
--- a/app/templates/userpage_post.html
+++ b/app/templates/userpage_post.html
@ -19,10 +19,19 @@
    <title>EnglishPal Study Room for {{username}}</title>
 </head>
 <style>
    #checkall{
        opacity: 0;
    }
    #span{
        opacity: 0;
    }
 </style>
 <body>
     <p>勾选不认识的单词</p>
      <form method="post" action="/{{username}}/mark">
       <input type="submit" name="add-btn" value="加入我的生词簿"/>
       <input type="checkbox" name="add-btn" value="全选"id="checkall"/><span id="span">全选</span><br>
       {% for x in lst %}
          {% set word = x[0]%}
        <p>
@ -32,7 +41,6 @@
            ({{x[1]}})
            <input type="checkbox" name="marked" value={{word}}>
        </p>
       {% endfor %}
       </form>
    {{ yml['footer'] | safe }}
@ -41,5 +49,22 @@
            <script src="{{ js }}" ></script>
        {% endfor %}
    {% endif %}
            <script>
        let all=document.getElementById("checkall");
        let span=document.getElementById("span");
        let checks=document.getElementsByName("marked")
        if(checks.length>10){
            all.style.opacity='1'
            span.style.opacity='1'
        }
    all.addEventListener("click",function(){     //在按钮处设置监听
            let flag=all.checked;                   //把按钮的checked值赋给flag
        for(let i=0;i<checks.length;i++){        
            //循环多选框元素集，把多选框的checked改成flag，
            //当btn选中，其他也选中，状态跟随
            checks[i].checked=flag;
        }
    })
            </script>
 </body>
 </html>