'选择'可编辑div中的图像

时间:2014-12-23 21:08:05

标签: jquery css contenteditable text-editor rich-text-editor

使用contenteditable div工作基本文本编辑器。

使图像可选择然后可删除的任何解决方案。因此,用户可以点击图像上的“突出显示”而不是键盘上的退格,然后只删除该图像来推送删除。

用于测试的JSFiddle:http://jsfiddle.net/vbbay6jc/

备份代码:

<div contentEditable="true">
  <img class="temp-image" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcQLl0EqJ_0sAhvsYTsLJaazja4H3ol3dgBYd3OAfEqCWYR2EyRWH2CXxEM"/>
</div>

1 个答案:

答案 0 :(得分:2)

我做了一个非常简单的例子,首先选择图像,然后按del。希望能帮助到你。 http://jsfiddle.net/vbbay6jc/2/

var seleccionado;
$(".temp-image").on('click', function(){
    seleccionado = this;    
});

$('#newupdate-text-1').keyup(function(e){
    if(e.keyCode == 46){
        $(seleccionado).remove();
    }
})

您可以添加一个类来查看屏幕中选择的内容。