Javascript显示复选框值在值中以空格分隔

我有以下代码：

<input type="checkbox" name="module" value="module1" />
<input type="checkbox" name="module" value="module2" />
<input type="checkbox" name="module" value="module3" />
<div id="result"></div>

还有Javascript：

$('input[name="module"]').click(function(){ 
if (this.checked) {
var span = "<span id='" + this.value + "'>" + this.value + "<br /></span>";
$("#result").append(span);
}else{
$("#" + this.value).remove();
}
});

$（'input[name=“module”]）。单击（function（）{
如果（选中此项）{
var span=“”+this.value+“
”；
$（“#结果”）。追加（span）；
}否则{
$（“#”+this.value）.remove（）；
}
});

所有这些都很有效。但是，当我为带有空格的复选框引入一个值时，将停止从列表中删除该项

从上面可以看出，当引入空间时会发生什么。如何使其使用复选框值中的空格

提前谢谢

根据，该值在元素的主子树中的所有ID中必须是唯一的，并且必须至少包含一个字符。该值不能包含任何空格字符

试试这个：

$（'input[name=“module”]）。单击（函数（）{
var id=this.value.replace（//g，“”）；
如果（选中此项）{
var span=“”+this.value+“
”；
$（“#结果”）。追加（span）；
}否则{
$（“#”+id）.remove（）；
}
});
解决这个问题的一种方法是使用不间断空格

<input type="checkbox" name="module" value="module&nbsp;1" />
<input type="checkbox" name="module" value="module&nbsp;2" />
<input type="checkbox" name="module" value="module&nbsp;3" />



这适用于1个空格，例如：模块1，但如果我有“所有模块中的模块1”，一旦松开它，它就无法将其删除。正如中所指出的，HTML 5不允许id属性有任何空格。我同意你的答案。。它解决了这个问题。这应该是公认的答案