更新Div内文本的问题

Issue with updating text within a Div

本文关键字:问题 文本 Div 更新      更新时间:2023-09-26

我正在尝试更新div内的文本。div是可拖动和可调整大小的(使用jquery ui插件)。我需要更新文本,而不影响设置到div的任何这些属性。

在使div可调整大小时,jquery插件添加了两个内部div,并且该div在使用.text()方法更新父div的文本时被删除。有人知道怎么解决这个问题吗?

更新

前的div结构
<div ondblclick="showPopup(this)" class="draggable ui-draggable ui-resizable" 
             id="Text10" style="position: relative;">
    test
    <div class="ui-resizable-handle ui-resizable-e"></div>
    <div class="ui-resizable-handle ui-resizable-s"></div>
    <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" 
         style="z-index: 1001;"></div></div>

更新后的div结构

<div ondblclick="showPopup(this)" class="draggable ui-draggable ui-resizable"     
             id="Text10" style="position: relative; background-color: rgb(255, 255, 255); font-family: Arial; font-size: 13px; font-weight: bold;">
    test-updated
</div>

脚本使用:

$('#Text10').text($('#newText').val());

一种方法可能是在外部div中添加一个span标记。然后可以使用:

执行文本更改。
$('#Text10 > span').text($('#newText').val());

使用内span元素http://jsfiddle.net/4P73F/

JavaScript:

var i = 0;
$('#foo').draggable();
$('#foo').resizable();
setInterval(function () {
    $('#innerText').text('Some text ' + i);
    i += 1;
}, 1000);
HTML:

<div id="foo" style="width: 100px; height: 100px; background-color: #ccc"><span id="innerText"></span></div>