Question

function perso_div_add_text (id) {
      $('#perso_div').append('<span class="dragables off-focus" onmousedown="moused('+id+');" id="dragables_t'+id+'" contenteditable="true"></span>');
    }
$('#btn-add-text').on('click',function(){
    var s=$('#perso_div').find("span");
    if(s.length>0){
        if(confirm("you have already added text, want to add more??")){
            perso_div_add_text((s.length)+1);
        }
    }else{
        perso_div_add_text((s.length)+1);
    }
});

我在div中动态创建元素，这些提到的所有函数都工作正常，但不是这个

function moused (id) {
  console.log('#dragables_t'+id);
    console.log($('#dragables_t'+id).pageX+','+$('#dragables_t'+id).pageY);
//
}

我尝试了pageXOffset / pageYOffset，screenX / screenY所有这些都返回undefined。请帮忙

Answer 1

使用position jQuery Api

试试这段代码：

    function moused (id) { 
         console.log('#dragables_t'+id); 
         console.log($('#dragables_t'+id).position().left+'
                   ,'+$('#dragables_t'+id).position().top);
    }

结帐position()

Answer 2

尝试$('#dragables_t'+id).offset().left和$('#dragables_t'+id).offset().top

请参阅jQuery offset

关于pageX，你必须知道这个属性来自jQuery事件对象，jQuery对象和dom对象都没有这个属性。

为了使用pageX，你必须像这样绑定你的事件：

$("body").on("mousedown",".dragables off-focus",function(event){
    console.log(event.pageX+','+event.pageY);
})

并且不要忘记删除代码onmousedown="moused('+id+');"。

如果您尝试从其父级获取位置，则应使用jQuery位置：

$('#dragables_t'+id).position().left和$('#dragables_t'+id).position().top

请参阅jQuery position

Answer 3

更改此

onmousedown="moused('+id+');"

最终变成类似moused(dragables_t5)

的东西

到此

onmousedown="moused(\''+id+'\');"

最终变成类似moused('dragables_t5')

的东西

获取动态创建元素的位置

3 个答案: