Javascript 如何删除此字符串中的连字符（比听起来更复杂！）
我必须首先承认，我对JS了解很少，这是我在别处学到的一些代码的一个卑鄙版本。从本质上讲，它运行于列表项的集合中，并提取它们的类名（由CMS填充以反映例如“品牌”或“制造商”）将它们构建为字符串，将字符串拆分为数组并重复它们。然后，它基于类名创建一个唯一复选框列表，当选择或取消选择类名时，使用jquery过滤页面上的列表项 我的问题是，由于类名字符串被“空格”分割，如果类的值由多个单词组成，则填充该类的值必须连字符 但是。。。当脚本在页面上生成复选框的标签时，我想知道是否可以删除连字符而不破坏生成它的逻辑 这是我到目前为止的代码，如果你把它放到一个HTML文件中，你会看到它是如何工作的（jquery文件托管在其他地方） 任何帮助都将不胜感激Javascript 如何删除此字符串中的连字符（比听起来更复杂！）,javascript,string,Javascript,String,我必须首先承认，我对JS了解很少，这是我在别处学到的一些代码的一个卑鄙版本。从本质上讲，它运行于列表项的集合中，并提取它们的类名（由CMS填充以反映例如“品牌”或“制造商”）将它们构建为字符串，将字符串拆分为数组并重复它们。然后，它基于类名创建一个唯一复选框列表，当选择或取消选择类名时，使用jquery过滤页面上的列表项 我的问题是，由于类名字符串被“空格”分割，如果类的值由多个单词组成，则填充该类的值必须连字符 但是。。。当脚本在页面上生成复选框的标签时，我想知道是否可以删除连字符而不破坏生成
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="http://www.chewbz.com/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
/**
* Removes duplicates in the array 'a'
*/
function unique(a) {
tmp = new Array(0);
for(i=0;i<a.length;i++){
if(!contains(tmp, a[i])){
tmp.length+=1;
tmp[tmp.length-1]=a[i];
}
}
return tmp;
}
/**
* Returns true if 's' is contained in the array 'a'
*/
function contains(a, e) {
for(j=0;j<a.length;j++)if(a[j]==e)return true;
return false;
}
$(document).ready(function () {
// create a string of class names,
var stringOfClassNames = '';
// grab the class name of each list item to build that string
$('.filterThis > li').each( function (i) {
var thisClassString = $(this).attr('class');
stringOfClassNames = stringOfClassNames +' '+ thisClassString
});
// Trim spaces from the ends of that string:
stringOfClassNames = jQuery.trim(stringOfClassNames);
// convert the string to an array.
var arrayClasses = stringOfClassNames.split(' ');
// pull out only unique values from that array
arrayUniqueClasses = (unique(arrayClasses));
// we only want to create filters if there are multiple classes
if (arrayUniqueClasses.length > 1) {
// create box for filters
$('<div class="filters" id="filters"><\/div>').insertBefore('.filterThis');
// create the filter checkboxes based on all the class names
$.each(arrayUniqueClasses, function() {
$('<div class="filter-options"><input type="checkbox" checked="checked" value="'+this+'" class="filter-checkbox" id="filterID'+this+'" />'+this+'<\/div>').appendTo('.filters');
});
// create a 'show all' checkbox
$('<div class="filter-options-all"><input type="checkbox" checked="checked" value="filterAll" class="filter-checkbox" id="filterIDall" />Show All<\/div>').appendTo('.filters');
// create a close button
$('<img src="" id="filter-close" onClick="document.getElementById(\'filters\').style.display = \'none\'"><\/div>').appendTo('.filters');
// the filter part
$('.filters input').click( function() {
var value= $(this).val();
if (value == 'filterAll') {
if ($(this).is(':checked')) {
$('.filters input').attr('checked','checked');
$('.filterThis li').fadeIn();
} else {
var one=1;
}
} else {
stringValue = '.filterThis > li.'+value;
if ($(this).is(':checked')) {
$(stringValue).fadeIn();
} else {
$(stringValue).fadeOut();
$('.filters #filterIDall').removeAttr('checked');
}
}
});
}
});
</script>
</head>
<body>
<style>
<!--
ul.filterThis {
list-style-type:none;
}
ul.filterThis li {
width:200px;height:200px;background:#eee;border:solid 1px #ccc;float:left;margin:10px;
}
-->
</style>
<ul class="filterThis">
<li class="Medium-Jars">
<div class="product-container">
Medium Jars
</div>
</li>
<li class="Large-Jars">
<div class="product-container">
Large Jars
</div>
</li>
<li class="Sweets">
<div class="product-container">
Sweets
</div>
</li>
<li class="Medium-Jars">
<div class="product-container">
Medium Jars
</div>
</li>
<li class="Sweets">
<div class="product-container">
Sweets
</div>
</li>
</ul>
</body>
</html>
/**
*删除数组“a”中的重复项
*/
功能独特（a）{
tmp=新阵列（0）；
对于（i=0；i 1）{
//为过滤器创建框
$（''）.insertBefore（'.filterThis'）；
//基于所有类名创建筛选器复选框
$.each（arrayuniquelclasses，function（）{
$（''+this+''）.appendTo（'.filters'）；
});
//创建“全部显示”复选框
$（'Show All'）.appendTo（'filters'）；
//创建一个关闭按钮
$（''）.appendTo（'.filters'）；
//过滤部分
$（'.filters输入'）。单击（函数（）{
var值=$（this.val（）；
如果（值='filterAll'）{
如果（$（this）.is（':checked'））{
$（'.filters input'）.attr（'checked'，'checked'）；
$（'.filterThis li'）.fadeIn（）；
}否则{
Var1=1；
}
}否则{
stringValue='.filterThis>li.'+value；
如果（$（this）.is（':checked'））{
$（stringValue）.fadeIn（）；
}否则{
$（stringValue）.fadeOut（）；
$（'.filters#filterIDall'）.removeAttr（'checked'）；
}
}
});
}
});
-
中罐
-
大罐子
-
糖果
-
中罐
-
糖果
// create the filter checkboxes based on all the class names
$.each(arrayUniqueClasses, function() {
$('<div class="filter-options"><input type="checkbox" checked="checked" value="'+this+'" class="filter-checkbox" id="filterID'+this+'" />'+this+'<\/div>').appendTo('.filters');
});
//基于所有类名创建筛选器复选框
$.each（arrayuniquelclasses，function（）{
$（''+this+''）.appendTo（'.filters'）；
});
//基于所有类名创建筛选器复选框
$.each（arrayuniquelclasses，function（）{
$（''+this.replace（'-'，''）+''）.appendTo（'.filters'）；
});
.replace（）填充类的值是否可以使用下划线代替空格而不是连字符？（我没有读过代码，如果我的建议没有意义，请道歉。）听说过吗？类名可以包括连字符，如果这就是这里发生的事情，它们会造成糟糕的delimeter。是的，这是一个很好的回答，编辑代码并使用下划线分隔，然后将下划线转换为空格，表示可以使用空格和连字符。谢谢大家@多姆：好极了！很高兴听到我们帮忙。我们也非常感谢您以投票和接受答复的形式表示的感谢。
// create the filter checkboxes based on all the class names
$.each(arrayUniqueClasses, function() {
$('<div class="filter-options"><input type="checkbox" checked="checked" value="'+this+'" class="filter-checkbox" id="filterID'+this+'" />'+this.replace('-',' ')+'<\/div>').appendTo('.filters');
});