我想通过使用HTML5和JavaScript编写一个画布图应用程序。这个应用程序的主要元素是一个盒子,用户可以在其中写入长文本,并且在写入文本时应该调整盒子的大小。我意识到最好的方法是在用户想要写入textarea标签时使用textarea标签,并且当用户在textarea上失去焦点(模糊事件)时,它将变为textarea中具有相同值的标签。通过使用textarea标签代替输入的标签的HTML5中的可调整和多行标签
/p>
"http://www.w3.org/TB/xhtml1/DTD/xhtml1-transitional.dtd">
Editable Label$(document).ready(function() {
$('#txt').blur(function() {
if ($('#txt').val().trim() != '') {
$('#txt').hide();
$('#lbl').html($('#txt').val());
$('#txt').val('');
}
});
$('#lbl').click(function() {
if ($('#lbl').html().trim() != '') {
$('#txt').show();
$('#txt').val($('#lbl').html());
$('#lbl').html('');
}
});
});
我可以让文本框出现在多行,但问题是,我不知道如何使标签:你可以看到下面的相关的代码出现在多行中。我搜索了很多,并且在样式化标签时已经使用了white-space:normal;和display:inline-block;和width: 20px;,但它没有起作用。我想知道是否需要使用Jquery调整标签大小(宽度和高度)。如果是的话,我该怎么做呢?
请注意,由于用户输入的字数未知,因此我无法使用换行符。
任何帮助将不胜感激。
2014-09-24
zahra
+0
对HTML5的DOCTYPE的应该仅仅是'' –
2014-09-24 02:31:31
+0
你还要额外双在那里引用:“;” > –
2014-09-24 03:04:16
+0
@Fabio感谢您编辑我的问题。 –
2014-09-24 03:33:59