Question

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

在使div可调整大小时，jquery插件会添加两个内部div，并且在使用.text（）方法更新父div的文本时会删除此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());

Answer 1

一种方法可能是在外部div中添加span标记。然后可以使用以下命令执行文本更改：

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

Answer 2

以下是使用内部元素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>

在Div中更新文本的问题

2 个答案: