Question

我有一些textarea内容包含img＆amp; DIV。我需要删除所有img和div。但保持img的替代。

在下面的代码段中，删除所有img和div。

$('textarea').val(function(i, val) {
  return $('<div>').html(val).text();
});

textarea {
  width: 250px;
  height: 100px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="mycontent">
  <textarea>some img
    <img src='whatever1.gif' alt='Title 1'>in text area
    <img src='whatever2.gif' alt='Title 2'>must be gone but keep img alt.
    <img src='whatever3.gif' alt='Title 3'>all div must gone.
    <div id="someID fromdiv">
      <div></div>
    </div>
  </textarea>
</div>


<div class="mycontent">
  <textarea>ANOTHER some img
    <img src='whatever4.gif' alt='Other Title 4'>in text area
    <img src='whatever5.gif' alt='Title 5'>must be gone but keep img alt.
    <img src='whatever6.gif' alt='Other Title'>all div must gone.
    <div id="someID" class="classDiv">
      <div></div>
    </div>
  </textarea>
</div>

保持img的alt的最佳方法也不会被删除？

任何导游都非常感激。

谢谢。

Answer 1

在删除附带的HTML之前，将图片替换为alt属性。

$('textarea').val(function (i, val) {
    return $('<div>').html(val)
                // replace images with their alt attribute
                .find("img").replaceWith(function() {
                    return this.alt;
                }).end()
                .text();
});

＆＃13;

$('textarea').val(function (i, val) {
    return $('<div>').html(val)
                // replace images with their alt attribute
                .find("img").replaceWith(function() {
                    return this.alt;
                }).end()
                // remove any html
                .text();
});

＆＃13;

textarea {
  width: 500px;
  height: 100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="mycontent">
    <textarea>some img
        <img src='whatever1.gif' alt='Title 1' />in text area
        <img src='whatever2.gif' alt='Title 2' />must be gone but keep img alt.
        <img src='whatever3.gif' />all div must gone.
        <div id="someID fromdiv">
            <div></div>
        </div>
    </textarea>
</div>
<div class="mycontent">
    <textarea>ANOTHER some img
        <img src='whatever4.gif' alt='Other Title 4' />in text area
        <img src='whatever5.gif' alt='Title 5' />must be gone but keep img alt.
        <img src='whatever6.gif' alt='Other Title' />all div must gone.
        <div id="someID" class="classDiv">
            <div></div>
        </div>
    </textarea>
</div>

＆＃13;

Answer 2

以下代码可以帮助您，但我不明白为什么您在文本区域中编写html其无效的HTML代码

 <script type="text/javascript">
        function RemoveAllImge() {
            $("#YourTextAreaID img").each(function () {
                $(this).attr('src', '');
            });
        };
        function RemoveAllDiv() {
            $("#YourTextAreaID div").each(function () {
                $(this).remove();
            });
        };
    </script>

jQuery删除textarea中的img，但保留alt属性并删除所有div

2 个答案: