Question

如何将div中的插入符光标设置为contenteditable但子节点不满足。我有这个代码，只要我点击div

，光标就会转到子div

请帮助

var container = document.createElement('P');
                    container.id = 'Cakdlsfj';
                    container.className ='dragClass7 ';
                    container.style.zIndex = 500;
                    container.setAttribute('style','width:150px;height:20px; overflow:hidden ');
                    container.contentEditable = true;
                    container.style.position = 'absolute';
                    container.style.left = x+'px';
                    container.style.top = y+'px';
                    container.focus();
                    var div1 = document.createElement('DIV');
                    div1.setAttribute('style','background-color:gray; opacity:0.8; ');
                    **div1.contentEditable = false;**
                    div1.style.position = 'absolute';
                    div1.style.right = '20px';
                    div1.style.bottom = '0px';
                    div1.innerHTML = "A- &nbsp;&nbsp;&nbsp;        A+";
                    **container.appendChild(div1);
                    document.body.appendChild(container);**

                    div1.addEventListener('mouseover',function(){

                        div1.style.cursor = "pointer";
                    });

                    $('.dragClass7').draggable();
                    $('.dragClass7').resizable({autoHide:true});

检查粗体中的行...但我默认将光标设置在子div上。即使它不可编辑

Answer 1

目前还不完全清楚你是否在这里使用jQuery，但是使用原生的javascript focus方法应该将插入符号设置为contentEditable元素，如下所示：

var element = document.getElementById('Cakdlsfj');

element.focus();

应该提到的是，你应该在之后将元素添加到DOM中。

如何在父div中设置游标，其中contenteditable设置为true但我有

1 个答案: