Tam*_*ara 3 html jquery line-breaks
我有以下小脚本预览一些文本,然后将其提交到数据库中存储:
jQuery(function($) {
var input = $('#contents'),
preview = $('#previewaccordion div.viewcontents');
input.keyup(function(e) {
preview.html(input.val());
});
});
Run Code Online (Sandbox Code Playgroud)
但如果我用换行符键入文本,它会忽略它们并将它们全部写入一行.我怎么能更换换行符以便它们正确显示?
它与jQuery无关:HTML中的Linebreaks并不重要,它们只是空格(如空格和制表符).
要在HTML中强制换行,请使用<br>标记.所以你可以改变
preview.html(input.val());
Run Code Online (Sandbox Code Playgroud)
至
preview.html(input.val().replace(/\r?\n/g, '<br>'));
Run Code Online (Sandbox Code Playgroud)
请注意,您也没有转义HTML特殊字符(如<或&),因此如果您键入它们,您的输出可能不正确.所以你可以选择:
preview.html(input.val().replace(/&/g, '&').replace(/</g, '<').replace(/\r?\n/g, '<br>'));
Run Code Online (Sandbox Code Playgroud)
最后,我想钩keypress以及keyup,所以你看,通过按键重复创建字符(火灾keypress,但没有keyup).
我假设您使用textarea作为输入.有\n用作换行符,对HTML没有影响.所以你必须用br-tags替换它们:
input.val().replace(/\n/g, "<br />");
Run Code Online (Sandbox Code Playgroud)