Question

我试图通过单击标题元素来显示数据库数据。基本上可以在点击时切换数据。我做了一个jQuery处理相同。我是新来的，我无法弄清楚这个问题。谁能解释？

在单击查看评论时，我想查看该特定图片的评论。

jQuery：

<script>
   $('#headingone').click(function(event){
   event.preventDefault();
   var b = $(event.target)
   b.find('.menu').toggle("slide")
  })
</script>

HTML：

            <h5 id="headingone" data-target=".menu">View Comments</h5>
            <div class="menu">
              {% for i in item.piccomments.all %}
                <p id="paratwo" style="margin:0px;"><strong>{{i.author}}</strong> said "{{i.text}}"</p>
              {% endfor %}
            </div>

Answer 1

您只需从单击的标题元素中获取lambda_code属性的值。此代码应执行以下操作：

data-target

  $('#headingone').click(function(event){
   event.preventDefault();
   var b = $(this).attr("data-target");
   $(b).toggle("slide")
  })

我希望对您有帮助

Answer 2

您在此处使用.find()来搜索子元素。在这种情况下，我将使用this获取被点击的元素并使用.siblings()或.next()从那里遍历：

 $('#headingone').click(function() {
   $(this).siblings('.menu').toggle("slide");
 })

.menu {
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h5 id="headingone" data-target=".menu">View Comments</h5>
<div class="menu">
  <p id="paratwo" style="margin:0px;"><strong>{{i.author}}</strong> said "{{i.text}}"</p>
</div>

如果#headingone不是链接，按钮或表单元素，则此处不一定需要event.preventDefault();。

jQuery事件目标/ relatedTarget问题

2 个答案: