转义内容与jQuery的.html()函数
问题描述:
我需要接受任意的用户输入。后来,我想将已经转义为HTML实体的输入复制到textarea中,以便编辑它。但是,jQuery的jQuery.html()
函数读出HTML实体,就好像它们是真实的HTML并将用户脚本直接注入到页面中。我需要抓取用户输入的内容,即使它包含<script>
标签,并输出到可以编辑它的textarea。转义内容与jQuery的.html()函数
所以,我需要这样的:
<textarea name="empty"></textarea>
<div name="user-input"> <script> window.alert('hi'); </script> </div>
变成这样:
<textarea name="empty"> <script> window.alert('hi'); </script> </textarea>
<div name="user-input"> <script> window.alert('hi'); </script> </div>
JavaScript的触发器。 textarea变为:
<textarea name="empty"> <script> window.alert('hi'); </script> </textarea>
显示一个空的文本框并将用户的JavaScript注入页面。
现在我获取用户输入的内容,并将它们放置到textarea的,像这样:
$('#edit-textarea').html(($('#user-input').text()));
我已经试过这几个变化无济于事。
请参阅http://jsfiddle.net/vkRkt/8的测试用例。
编辑:
请参阅下面的讨论。我的解决方案是使用jquery.val()
而不是jquery.html()
。我跳过val,因为我的印象是它是jquery.attr('value', new_value)
的别名,它有它自己的注入问题(可以用“”来停止)。val()
与attr('value', val)
不一样,在我的注入尝试中似乎是安全的简短的测试。
如果有人碰到这个以后运行,并知道val
其实并没有做到这一点的安全方法,请回答,并立即更新我们。
感谢。
答
$('#edit-textarea').val(($('#user-input').text()));
工作正常我,我也尝试使用.text()
而不是.val()
,它当然也保持逃跑。如果您不希望数据为HTML,请勿使用.html()
。
我以前调整值,但是这不是真的修改textarea的内容,*和*我的报价都没有逃过aforehand这么一个简单的“允许用户注入正确的地方。我希望避免通过使用html(),我只想填写 – jeffcook2150
之间的区域有趣的是,经过进一步考虑,val()将该值设置为JavaScript属性,我相信它只是一个快捷方式'attr('value',new_value)',所以也许这会起作用。谢谢,我会尝试一下 – jeffcook2150
HTML只是开始的位置,从此以后,所有事情都发生在DOM中。 – kapa