0

JsFiddle：http: //jsfiddle.net/sharat87/qWCQT/

正如您在上面的 jsfiddle 中可以（或不能）看到的那样，当您单击带有 的div元素下方时contenteditable，它会失去焦点，这是理所当然的。但是当你对一个带有 的span元素做同样的事情时contenteditable，它不会失去焦点。此外，div具有样式的元素的行为与此场景中的元素display: inline-block完全相同。span

在我的应用程序布局中，我需要将contenteditable元素显示为inline-block. 但是当单击下面给出的空白区域时，它应该失去焦点，这是明确提供的，用于失去焦点和特定于上下文的目的。我不希望contenteditable元素保持焦点。

有什么办法解决这个问题，除了通过javascript处理点击和blur-ing元素吗？contenteditable

4

1 回答 1

1

我刚刚添加style/display property了 JavaScript，具体取决于Browser它并且它有效

window.onload=function(){
    var ua=navigator.userAgent;
    var spans=document.getElementsByTagName('span');
    for(i=0;i<spans.length;i++)
    {
        if(spans[i].className=='content')
        {
            if(ua.indexOf('MSIE')!=-1) spans[i].style.display='inline-block'; 
            else spans[i].style.display='inline-table'; 
        }
    }
};

在 Chrome、FF、IE8 和 Opera 中测试。这里有一个例子。

于 2012-12-06T17:28:05.467 回答