Question

代码：

 <script src="Scripts/jquery-1.8.2.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var $this = $("#Test_txtarea");
        var txtval = $this.val();
        $this.find("img").each(function () {
            var imgbytes = $(this).attr("name"); // extract bytes from selected img src 
            $(this).replaceWith(imgbytes);
        });
        $("#NewVal").html(txtval);
     });
</script>

HTML

<textarea ID="Test_txtarea" >Hi <img src='test.png' name='test' > kifak <img src='test2.png' name='test1' > Mnih <img src='test3.png' name='test3' ></textarea>
 <span id="NewVal" ></span>

我想要做的是基本上尝试用它的名字替换每个img标签，以便最终的textarea值如下：嗨test kifak test1 Mnih test3

这是jsfiddle：http://jsfiddle.net/Ga7bJ/2/

.find("img")总是返回0作为length.how我可以修复此代码吗？

Answer 1

虽然这不是完整答案，或者至少不是“复制粘贴”答案，但您在这里做的事情很少：

Textarea的内容是VAL而不是InnerHTML。因此，您必须选择该内容作为值，而不是创建一个隐藏的div并将其作为HTML。完成后，您现在可以使用find轻松找到其中的HTML标记。
找到代码后，您可以使用attr()函数找到该名称
一旦你有了名字，你就会再次回到textarea的val（），做正则表达式替换或使用HTML，你可以替换，我猜，但不确定。

Answer 2

以下代码适用于我。基本上，我得到文本区域的值并将其附加到屏幕外的div。现在我有了有效的标记嵌套，我可以正常迭代子节点。

function byId(e){return document.getElementById(e)}
function newEl(t){return document.createElement(t)}
function test()
{
    var div = newEl('div');
    div.innerHTML = byId('Test_txtarea').value;
    var msg = '';
    var i, n = div.childNodes.length;
    for (i=0; i<n; i++)
    {
        if (div.childNodes[i].nodeName == "IMG")
            msg += div.childNodes[i].name;
        else if (div.childNodes[i].nodeName == "#text")
            msg += div.childNodes[i].data;
    }
    byId('NewVal').innerHTML = msg;
}

Answer 3

看看这个jsFiddle。做的是：

它从Test_txtarea获取值并将其设置为隐藏div的html 隐藏的div将在textarea中呈现图像渲染完成后，我会发现这些图像，
- 得到消息来源，
- 删除.后的所有字符 - 用src替换图像的整个html 在完成所有这些工作之后，您将获得一个具有所需值的div 接下来所做的就是将div中的html复制到textarea的值。

 function replaceImageWithSrc(value){
        var div = $("#invisible");
        div.html(value);
        var images = div.find("img");
        images.each(function(index){
           var src = $(this).attr("src").split(".")[0];
           this.outerHTML = src;
        });
    return div.html();

}    
$(document).ready(function () {
        var txtArea = $("#Test_txtarea");
        var txtval = txtArea.val();
        txtval = replaceImageWithSrc(txtval);
        txtArea.val(txtval);
    });

用文本替换textarea中的html标签

3 个答案: