从动态数据中删除弹出框内的双引号

Question

我正在使用 Bootstrap Popover 动态显示文章的摘要，这意味着，这可以有双引号 (")，单引号 (')、大量空格 ( ) 和其他特殊字符。因为复制/粘贴来自 word、在线等的内容...

有人可以帮我吗，如何从我的 Popover 内容中删除双引号？

PS：出于演示目的，我在 data-content 元素中直接提供文本。但实际上，这些数据将由“article-description”CSS 类动态触发。

我的 HTML

<!-- Working -->
<article class="category-content" data-content="<div class='article-description'>Lorem Ipsum dolar sit amet</div>" rel="popover" data-placement="bottom" data-original-title="Title" data-trigger="hover">Popover with HTML Content</article>

<!-- Not Working -->
<article class="category-content" data-content="<div class='article-description'>Lorem &nbsp;&nsp;&nbsp;&nbsp; "Test" Ipsum dolar sit amet</div>" rel="popover" data-placement="bottom" data-original-title="Title" data-trigger="hover">Popover with Special Characters.. Eg: " (Double Quotes)</article>

我的 CSS

body{margin:100px auto;text-align:center;}

.category-content{
  width:100%;
  padding:10px 0;
  text-align:center;
  background:#eee;
  cursor:pointer;
  margin-bottom:15px;
}

我的脚本

$(document).ready(function(){
    $('.category-content').popover({html:true});
});

JsFiddle更多解释

:: 更新 ::

我现在可以在不使用data-content标签的情况下获取html内容，但仍然努力删除动态数据的特殊字符。

谁能帮帮我！

Answer 1

我建议有更好的方法来实现你想要做的事情。数据属性并不真正打算包含 HTML，并且尝试以这种方式做事会使您的 HTML 不可读（以及，正如您所发现的，会被引号破坏）。

更好、更健壮的方法是在data-content 属性中只包含弹出框的内容（没有任何HTML 标记），并使用Javascript 创建弹出框的HTML (<div class='article-description'></div>) 并插入内容。