onclick属性,当javascript的参数中有单引号或双引号时,包JS错误。

JustForFly 发布于 2012/03/14 21:16
阅读 19K+
收藏 4

遇到一个问题,在HTML的标签中,当onclick属性中的javascript传入的参数包含单引号或者双引号时,会包JS错误。

例如:

<input onClick="doSomething('${param}');" type="button" />

当后台传来的param字符串带有单引号或者双引号时,

IE6在载入页面时直接报错,

FF载入页面虽然没有报错,但是点击按钮后没有反应,用firebug查看控制台,会看到也有错误信息。

原因就是参数中的单引号或双引号使得<input>标签没有正确的结束。

我尝试一些办法:

1.解决方案1:解决单引号问题

<c:set var="temp_param" value='${fn:replace(param,"\'","\\\\\'")}' />
<input onClick="doSomething('${temp_param}');" type="button" />

2. 解决方案2: 解决双引号问题

<c:set var="temp_param" value="${fn:escapeXml(param) }"/>
<input onClick="doSomething('${temp_param}');" type="button" />

 想问问大家,还有没有更好的方法,可以同时解决单、双引号的问题?

谢谢!

PS:

<c:set var="temp_param" value="${fn:replace(param,'\"','\\\\\"')}" />
<input onClick="doSomething('${temp_param}');" type="button" />

这样是无法正确解决双引号问题的。

加载中
1
pyawen
pyawen
<input type="button" onclick="alert('\'aaa');" value="alert" />

把引号转成上面那样就可以了  
pyawen
pyawen
@JustForFly : 刚才被转义了 用 & quot; 去掉中间的空格
pyawen
pyawen
@JustForFly : 把双引号转义为 " 单引号按上面那样处理
JustForFly
JustForFly
首先谢谢你的回答。 我的方案1就是这样做的。 不同在于,你是直接传字符串 'aaa,而我的问题是,传入的字符串是来自后台的(存放在request中的变量),你不知道里面是有单引号还是有双引号。 所以,我的需求是,能不能有一次性就将后来传来的参数中带有的特殊符号转义的方法,转义后,就可以直接作为javascript的参数。
0
JustForFly
JustForFly

谢谢你的回答,在你的提醒下,我最后只能用下面的方法来解决问题:

	<c:set var="temp_param1" value="${fn:escapeXml(param1) }"/>
	<c:set var="temp_param1" value='${fn:replace(temp_param1,"&#039;","\\\\\'")}' />
	<input type="button" onclick="test('${temp_param1}');" value="param2" /><br/>

还是找不到能够一步到位的方法。

虽然fn:escapeXml可以将单引号和双引号都转义为:&#039; 和 &#034;

但是&#039;(单引号)作为JS的参数还是会报错,所以,我又只有再转义&#039;为 \' ,只有 \' 不会报错。

0
opal
opal

用我的方法,永远不会出现问题,加一个ID属性就可以了

<input type="button" id="btnTest" value="param2" />
<script for="btnTest" event="onclick" type="text/javascript">test('${temp_param1}')</script>

 

0
JustForFly
JustForFly

引用来自“opal”的答案

用我的方法,永远不会出现问题,加一个ID属性就可以了

<input type="button" id="btnTest" value="param2" />
<script for="btnTest" event="onclick" type="text/javascript">test('${temp_param1}')</script>

 

先谢谢你的帮助。
你的方法不行。
1.在FF中点按钮,没有反应。
2.在IE中,
如果是单引号,写成下面的形式,没有问题
<script for="btn1" event="onclick" type="text/javascript">
	test("${param1}");
</script>


但是,写成 
test('${param1}');

依然会报错。

如果是包含双引号,则结果和上面的相反。

3.如果字符中既有单引号,也有双引号,就都有问题了。

其实,我提出的问题,就是要解决你这样写会出现的问题。
0
xiaoyang0878
xiaoyang0878

我的解决方法:
1、输入格式控制,把单双引号不让输入(当前中文的可以输入);
2、先将数据转义后,再与onclick绑定;

JustForFly
JustForFly
针对当前数据转义应该是可行的。
xiaoyang0878
xiaoyang0878
@JustForFly : 先不考虑对所有的数据进行转义,如果只对当前读取的数据转义是否可行?
JustForFly
JustForFly
1.我这个系统不能做这样的限制,我这个里面会用到法文,里面很多有单引号。而且,很多初始化的数据里,也有单引号。 2.我也想过这个方法,但是需要转义的地方太多。我想过全部去转义,但是担心对性能的影响,以及其他的不确定因素。 目前,我所考虑的是把需要转义的地方列出来,选择性过滤。
0
goingta
goingta

把外面的双引号去掉

<input onClick=doSomething('${param}'); type="button" />

0
k
kevihu

可能的包含:单引号,双引号,还有回车等

用一个var来表示,如果有多个变量使用array来存string.

在JavaScript中调用时再从var中取.

 

返回顶部
顶部