在前端循环中使用鼠标悬停事件
1 <div class="message-widget contact-widget">
2 <!-- Message -->
3 {% for li in row.model.all %}
4 <a class="mose" href="#">
5 <input type="text" style="display: none" value="{{ row.id }}"/>
6 <div class="mail-contnet" style=" 148px;height: 43px; ">
7 <div class="delebt" style="display: none; position: absolute">
8 <button type="button"></button>
9 </div>
10 <h5>型号</h5> <span class="mail-desc" overflow="visible">{{ li.model }}</span>
11 </div>
12 </a>
13 {% endfor %}
14 <!-- Message
15 <a href="#">
16 <div class="mail-contnet" >
17 <h5>Sonu Nigam</h5> <span class="mail-desc">pamela1987@gmail.com</span></div>
18 </a>-->
19 </div>
1 {% block js %}
2 <script src="../static/plugins/jquery/jquery.min.js"></script>
3 <script>
4 //在循环中使用鼠标悬停时表示当前悬停选中,传入this关键字即可
5 $(".mose").mouseenter(function () {
6 $(".delebt",this).css("display","block");
7 })
8 $(".mose").mouseleave(function () {
9 $(".delebt",this).css("display","none");
10 })
14 </script>
15 {% endblock %}