如何更换使用JavaScript追加 [英] How to replace and append with Javascript

问题描述

我有，我想实现在线编辑（如果有人知道一个很好的插件或者类似的东西，请不要犹豫，给我一个名字）的注释系统，发现一个JavaScript片段，其与textarea的替代文本和文本作为textarea的价值。

I have a comment system in which I want to realize inline-editing (when someone knows a good plugin or something similar please don't hesitate to give me a name) and found a Javascript snippet which replaces the text with a textarea and the text as the value of that textarea.

但现在我需要添加一个按钮（提交按钮）来表示文字区域，这样用户可以节省他编辑的文本。

But now I need to add a button (submit button) to that textarea so that the user could save the text he edited.

我的code现在看起来像

My code looks now like

<span id="name">comment</span>

<div onclick="replacetext();">test</div>

<script type="text/javascript">
    function replacetext(){
            $("#name").replaceWith($('<textarea>').attr({ id: 'name', value: $('#name').text() }));
    </script>

我和 $（＃名称）测试了它追加。（'＆LT;按钮＆GT;是＆LT; /按钮＆GT;'）; ，但它没'将不起作用。

I've tested it out with $("#name").append('<button>yes</button>'); but it didn't work.

推荐答案

该解决方案可以使用以下的jsfiddle被试验：的 http://jsfiddle.net/adb8X/5/

The solution can be tried out using the following jsFiddle: http://jsfiddle.net/adb8X/5/

我相信你行追求的是：

  $('<button>yes</button>').insertAfter("#name")

在code上方插入一个新创建的DOM元素（是）在目标选择器（＃NAME）指定标识的DOM lelement之后。

The code above inserts a newly created DOM element (yes) right after the DOM lelement with the specified id in the target selector ("#name").

更多关于 insertAfter 在这里：的http：// API .jquery.com / insertAfter /

如果您想将它插入 replacetext（），就会变成：

If you want to insert it into replacetext(), it will become:

function replacetext() {
    $("#name").replaceWith($('<textarea>').attr({
        id: 'name',
        value: $('#name').text()
    }));

    $('<button>yes</button>').insertAfter("#name")

} 

---

请注意：我还纠正了的jsfiddle。请点击这里： http://jsfiddle.net/adb8X/5/ （有与问题设置和一个小错字，如果我没有记错）。在对应的线路是：

---

Note: I also corrected your jsFiddle. Please check here: http://jsfiddle.net/adb8X/5/ (There were problems with the settings and a small typo if I recall correctly). The corresponding line in that is:

 $("#name").append($('<button>hi</button>'))

这篇关于如何更换使用JavaScript追加的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！