在输入框中禁用一些html输出 [英] Disable some html output in input box

问题描述

我有一个像聊天框一样的输入。 （用户在输入中键入内容并在页面上输出）。我刚刚注意到，用户还可以在我的输入框中使用 html标记来更改输出。

示例：如果我输入< b> Hello< / b>



我不想完全禁用此功能。但有些标签我不想输出（例如 h1 或 h2 ...）。我认为这是可能的正则表达式（不知道如何继续这样做），但我觉得可能有一个更容易的解决方案，如果不是，只需投入任何作品。

以下代码让我的输入框起作用：

  $（'form'）。on（'submit'，function（e）{
 e.preventDefault（）; 
 checkValue（）; 
}）; 
 
函数checkValue（）{
 var message = document.getElementById（userinput）.value; 
 $（'＃output'）。html（message）; 
} 
  

谢谢。 b $ b

  var message = $（'< / p> （）：}，{
 html：document.getElementById（userinput）。value 
}）。find（'：header'）.delete（）.end（）.html（）; 
  

或者你可以使用 replaceWith（function（）{return'< h>'+ this.innerHTML +'< / h>';}）而不是 remove（）。

DEMO jsFiddle

I have an input that works like a chat box. (The user types something in the input and it outputs on the page). I just noticed that the user can also use html tags in my input box to change the output.

Example: If I typed <b>Hello</b>, the output text would be bolded and so on...

I don't want to disable this function completly. But there are some tags that I don't want outputted (example h1 or h2...). I think that's it's possible with regex (not sure how too proceed with that though), but I feel like there may be a easier solution, if not, just throw in whatever works.

The code below is what gets my input box to work:

$('form').on('submit', function(e){
    e.preventDefault();
    checkValue();
});

function checkValue() {
    var message = document.getElementById("userinput").value;
    $('#output').html(message);
}

Thanks.

解决方案

See if that fits your needs:

var message = $('<div/>', {
    html: document.getElementById("userinput").value
}).find(':header').remove().end().html(); 

Or you could use e.g replaceWith(function(){return '<h>'+this.innerHTML+'</h>';}) instead of remove().

DEMO jsFiddle

这篇关于在输入框中禁用一些html输出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！