我有一个带有一些文本的p标签,并且我试图使其内容可编辑,但只能在doubleclick上.如何在单击鼠标时阻止浏览器将光标放在p上,而只有在双击鼠标时才将光标放在p上？ JQuery的：

    p.dblclick(function(e){
        p.css("cursor", "text");
    })
    .focusout(function(){
        p.css("cursor", "default");
    })
    .click(function(e){
        console.log('focus p');
        e.stopPropagation();
        $("body").focus(); // not stopping Chrome from placing cursor
    });

我可以默认将contenteditable设置为false,然后在dbleclick上将其设置为true,然后执行p.focus(),但这意味着我无法将光标放置在单击的位置.另一方面,我可以使它在第一次单击后可编辑,然后像1.5s一样等待dobuleclick,如果没有发生,则将其取消,但是如果发生,则内容将是可编辑的,第二次单击将触发将光标放置在正确的位置.但是,它并不是那么平滑,并且使内容在这半秒内可编辑.

有任何想法吗？

回答：
如果有人感兴趣,我继续实现timer方法,因为我认为没有其他方法……这是代码

var DELAY = 700, clicks = 0, timer = null;
p.focusout(function(){
    p.css("cursor", "default");
    p.prop("contenteditable", false);
})
.click(function(e){
    clicks++;
    p.prop("contenteditable", true);
    if(clicks == 1){
        timer = setTimeout(function() {
            p.prop("contenteditable", false);
            //alert("Single Click");  //perform single-click action
            clicks = 0;             //after action performed, reset counter
        }, DELAY);
    } else {
        clearTimeout(timer);    //prevent single-click action
       // alert("Double Click");  //perform double-click action
        clicks = 0;             //after action performed, reset counter
    }

});

解决方法:

在这里尝试工作fiddle

 <p ondblclick="this.contentEditable=true;this.className='inEdit';" onblur="this.contentEditable=false;this.className='';" contenteditable="false" class="">This paragraph uses some simple script to be editable. Double-click the text to begin editing.</p>