jQuery:如何添加<br/>在不同的字符串中换行以分隔2中的句子

jQuery: howto add a <br/> line break in different strings to separate sentences in 2?

本文关键字：句子 分隔 换行 字符串 何添加 添加 jQuery br lt gt      更新时间：2023-09-26

我有不同的句子，它们都有双引号，比如：

<h3 class="myClass">Sentence one "ends like this"</h3>
<h3 class="myClass">Sentence two"ends like that"</h3>
<h3 class="myClass">Sentence three "another ending"</h3>

全部在一页上。基本上所有的值都是不同的，我试图在双引号之前换行，所以它就像一样

<h3 class="myClass">Sentence one <br/>"ends like this"</h3>
<h3 class="myClass">Sentence two <br/>"ends like that"</h3>
<h3 class="myClass">Sentence three <br/>"another ending"</h3>

老实说，在split和text之间，我有点困惑应该使用哪个jQuery函数？任何帮助都将不胜感激，我需要了解如何做到这一点。。。非常感谢！

您可以匹配<h3>元素，然后将函数传递给html（）。该函数将为每个元素调用，将传递当前元素的内部HTML标记，并且必须返回新标记。

从那里，您可以使用replace（）在第一个双引号字符之前插入<br />元素

$("h3.myClass").html(function(index, currentHtml) {
    return currentHtml.replace('"', '<br />"');
});

你可以在这个小提琴里测试这个解决方案。

创建一个函数，获取jQuery对象的html，并将其更改为

function addBR($el) {

获取元素的html

var originalhtml = $el.html();

用引号拆分html，并用新的<br/>

var newhtml = originalhtml.split('"').join('<br />"');

应用新的html

$el.html(newhtml);

就这样。
称之为

addBR(jQuery element);


示例：http://jsfiddle.net/XFC5u/

我会看看Javascript split（）方法，但本质上你的想法是正确的。您想要根据双引号（''"）进行拆分，这将返回一个包含出现双引号的所有拆分的数组。

这样的事情就会发生：

var array = $(".myClass").text().split("'"");//array = [Sentence one, ends like this, ];

（不能100%确定代码是否正确，所以请有人检查><）

然后，您可以使用包含的
重新创建文本。至少我会这样做。

还要记住，split方法确实会从数组中删除''"（因为它将其用作拆分它们的限制器），所以在重新创建文本时一定要读取它们。

至于Jquery是否是一种特定的方法，我不确定。如果有人想改进我的答案，请随意。

看看这里，看看这个代码在工作：

$(".myClass").each(function() {
    var text = $(this).text();
    var q = text.indexOf('"');
    $(this).html(text.substr(0, q) + "<br />" + text.substr(q));
});

只需要一些基本的javascript（在jQuery循环中）

​$(".myClass").each(function() {   // for each item of myClass 
   var text = $(this).text();     // temp store the content
   var pos = text.indexOf('"');   // find the position of the "
   $(this).html(text.slice(0,pos) + '</br>' + text.slice(pos));    // slice before + <br> + slice after = new content
});​​​​​​​​​​

小提琴：
http://jsfiddle.net/JaPdT/

$('.myClass').each(function(){ 
    if($(this).text().indexOf('"') >=0 ){  
        $(this).text( $(this).text().replace('"', '<br/>"')  )   
    }
})
相关文章：