拆分文本并在jQuery元素中包装每个单词
Splitting text and wrapping each of the words in elements in jQuery
PS:更新后的小提琴
在元素
中换行文本这里是一个尝试使用逗号作为分隔符分割文本并在<span class="new"/>
中包装每个单词的fiddle。谁能告诉我为什么它在foreach循环中给我Uncaught TypeError: undefined is not a function
?
我希望输出是
<td>
<span class='new'>Text</span>
<span class='new'>that</span>
<span class='new'>needs</span>
<span class='new'>to</span>
<span class='new'>be</span>
<span class='new'>wrapped.</span>
<span class="count">not this</span>
<button>Wrap</button>
</td>
代码:$('button').click(function(){
var wrap_it = $(this).closest('td').contents().eq(0).text();
wrap_it = wrap_it.split(',');
console.log(wrap_it);
$.each(wrap_it,function(i,k){
k.wrap('<span class="new"/>');
})
});
HTML: <table>
<tbody>
<tr>
<td>1</td>
<td>Text,that, needs, to, be, wrapped.<span class="count">not this</span><button>Wrap</button>
</td>
</tr>
<tr>
<td>2</td>
<td>Text, that, needs, to, be, wrapped.<span class="count">not this</span><button>Wrap</button></td>
</tr>
</tbody>
</table>
我试了一下:
$('button').click(function(){
var text = $(this).closest('td').contents().eq(0).text().split(",");
var keep = $(this).closest('td').find(".count");
var button = $(this).closest('td').find('button');
for( var i = 0, len = text.length; i < len; i++ ) {
text[i] = '<span class="new">' + text[i] + '</span>';
}
$(this).closest('td').html(text.join(' ')).append(keep).append(button);
});
小提琴
如果适合的话请告诉我
也做了一个尝试
$('button').click(function () {
var text = $(this).closest('td').contents().eq(0).text().split(','),
len = text.length,
result = [];
for( var i = 0; i < len; i++ ) {
result[i] = '<span class="new">' + text[i] + '</span>';
}
var keep = $(this).closest('td').find(".count"),
button = $(this).closest('td').find('button');
$(this).closest('td').html(result.join(' ')).append(keep).append(button);
});
小提琴:换行
相关文章:
- 如何将函数包装在函数中以避免代码重复
- 当鼠标悬停在文本中的单词上时显示警报
- 我怎样才能把p中的一个单词包装在a标签中呢
- 如何在包含 Unicode 字符 'u00A0' 的表中包装单词
- 使用 Javascript 的 replace() 方法用 html 包装单词
- 将单词包装在标签中,保留标记
- 如何在下页编辑器的预览中包装单词
- JavaScript:如何用包含唯一id的span标记将字符串中的每个单词包装起来
- 使用jQuery自动包装DIV中的前一个单词
- 拆分文本并在jQuery元素中包装每个单词
- 如何将元素的每个单词包装在 span 标记中
- Javascript /从字符串中抓取第一个和最后一个单词,然后用class包装
- 在html元素中包装每个单词
- 如何包装html标签为jquery鼠标选择单词
- 将每个单词的第一个字母包装在span标签- javascript中
- Regexp用于包装HTML页面上的每个单词
- 如何在轴标签中只包装一个单词
- Jquery - 在字符串中查找一个单词并用 标签包装它
- 如果元素包含这些单词中的任何一个,则将该单词包装在 span 中
- 在javascript中,在单词边界的span标签中包装每个单词的正则表达式