.each(list, function(i, item){ $('#some-select').append(""+ item + ""); }); 但是提交之后被反馈说传进去的值好像不太对，比如item依次为`A item`, `B item...`，则最后到option里显示出来就是： ... A item B item ... ### 解决办

最近遇到一个问题，在放入含有空格`value`的时候，`value`总是被截断，然后提交的时候取到的值总不是想要的。比如我在ajax里获取到一些数据，然后需要依次放入一个下拉的选择框的选项里。本来像下面这样这样，随便写写就可以运行了: $.each(list, function(i, item){ $('#some-select').append(""+ item + ""); }); 但是

html中value含空格赋值被截断

Max

最近遇到一个问题，在放入含有空格value的时候，value总是被截断，然后提交的时候取到的值总不是想要的。比如我在ajax里获取到一些数据，然后需要依次放入一个下拉的选择框的选项里。本来像下面这样这样，随便写写就可以运行了:

$.each(list, function(i, item){ $('#some-select').append(""+ item + ""); });

但是提交之后被反馈说传进去的值好像不太对，比如item依次为A item, B item...，则最后到option里显示出来就是：

... A item B item ...

解决办法

用encodeURIComponent和decodeURIComponent肯定可以堵上这个bug，因为他们会把空格直接转换成%20这样的标识符，防止在url传输的时候出现问题。但是这里似乎和url没半毛钱关系。

排查之后发现，虽然拿工具看到的是

A item

，实际上上面js代码输出给html的内容是：

A item

如果这样就能看出问题了，大家都知道，html的标签属性是按照空格来区分的，所以取到value=A，就直接断掉了，然后item被认为是另外一个属性，如果直接打印到console就能看到：

A itemB item

问题到这里解决办法就很简单了，给value赋值的时候，应该单独加上引号，才不会被识别为其他标签。

$('#some-select').append(""+ item + "");

其他语言与此类似。

end

Comments

Table of content