获取元素的位置并使用javascript显示一个div

时间:2014-10-14 09:20:15

标签: javascript html

我有10个不同的按钮,我想在用户按下的按钮上显示一个隐藏的div。当前正好显示div的代码div的代码而不是取新的绳索顶部:左:

函数调用:

<img style="position:relative;float:right;padding-top:7px;" onclick="find_pos(this)" src="images/view_comments.png"></li></a>



function find_pos(ele) {

    var x=0;
    var y=0;
    while(true){
        x += ele.offsetLeft;
        y += ele.offsetTop;
        if(ele.offsetParent === null){
            break;
        }
        ele = ele.offsetParent;
    }
hidden_comment_form.style.display='block';
hidden_comment_form.style.top=y;
hidden_comment_form.style.left=x;
}

1 个答案:

答案 0 :(得分:0)

我给你2个选择: 选项1:

<div class="main">
<button class="btn">a</button>
<div class="toggle"> a toggle this </div>
</div>
<div class="main">
  <button class="btn">b</button>
  <div class="toggle"> b toggle this </div>
</div>
<script>
$(document).ready(function() {
   $('button.btn').on('click', function() {
      var $div =  $(this).siblings('.toggle');
      $div.toggle();
   })
 })
</script>

选项2:

<button class="btn">a</button>
<div class="toggle"> a toggle this </div>

<button class="btn">b</button>
<div class="toggle"> b toggle this </div>
<script>
$(document).ready(function() {
 $('button.btn').on('click', function() {
      var $div =  $(this).next();
      $div.toggle();
  })
})
</script>

我建议选项1更好