Question

我试图通过jquery用span内的br标签替换@。但是br不插入，每当我插入任何其他正确显示结果的文本时我无法理解为什么br标签不起作用，这是我的html代码的一个例子。

<span class="event-date-start">Oct 14 @ 1:00 pm</span>

这是我的jQuery

jQuery('.event-date-start').each(function(){
  jQuery(this).html(function(_, curr){
     return curr.replace('@', '<br />');
  });
});

我也试过.html但结果是一样的。我没有对html的任何控制，并且想要动态插入换行符。我几乎不需要任何指导来完成这项任务。

Answer 1

text()不会插入HTML。请改用html()方法

jQuery(this).html(jQuery(this).text().replace('@', '<br />'));

或html(function)

jQuery(this).html(function(_, curr){
    return curr.replace('@', '<br />');
});

Answer 2

您需要获取元素的文本并找到每个'@'并使用replace，然后返回html

的内容

查看解决方案：http://jsfiddle.net/juTtG/7/

HTML

<span class="event-date-start">Oct 14 @ 1:00 pm</span>

的jQuery

$(document).ready(function() {
  var $eventDateStart = $(".event-date-start");
  var content = $eventDateStart.text().replace('@','<br>');
  $eventDateStart.html(content);
});

Answer 3

以下是针对您的问题的原生JavaScript解决方案。你可以很容易地将它翻译成jQuery。

＆＃13;

var eventDateElements = document.getElementsByClassName('event-date-start');


function replaceWithBreak(element, stringToReplace) {
  var updatedText = element.innerHTML.replace('@', '<br />');
  element.innerHTML = updatedText;
}


replaceWithBreak(eventDateElements[0]);

＆＃13;

<span class="event-date-start">Oct 14 @ 1:00 pm</span>

＆＃13;

使用jquery在span标记内插入break

3 个答案: