如何在画布上制作像powerpoint可调文本的文本？

Question

图片：

我想在单击按钮时生成文本框，并且可在画布上调整和编辑。 这个图像实际上是我想要的例子。如果我可以使用任何可用的工具集成并使用HTML页面上的功能。

Answer 1

您可能需要查看http://interactjs.io/，根据它们是

  

JavaScript拖放，调整大小和多点触控手势，惯性和捕捉现代浏览器（以及IE8 +）

要编辑文字，您可以尝试以下内容：

$('#fullname').click(function(){
    var name = $(this).text();
    $(this).html('');
    $('<input></input>')
        .attr({
            'type': 'text',
            'name': 'fname',
            'id': 'txt_fullname',
            'size': '30',
            'value': name
        })
        .appendTo('#fullname');
    $('#txt_fullname').focus();
});

$(document).on('blur','#txt_fullname', function(){
    var name = $(this).val();
    //alert('Make an AJAX call and pass this parameter >> name=' + name);
    $('#fullname').text(name);
});

和html

<div id="fullname">Change me</div>

查看this pen