我正在尝试开发一个非常简单的add / toggle类方法,类似于 jQuery 的func filterArrayAlphabatically(contacts inputContacts: [Contact]) -> [[String: [Contact]]]
{
//Using this will remove any contacts which have a name not beginning with these letters, is that intended?
let alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".characters.map({ String($0) })
// For strings use a localized compare, it does sensible things with accents etc.
let allContacts = inputContacts.sorted { $0.name.localizedCompare($1.name) == .orderedAscending }
//Now we're using an array of dictionaries, each of which will have a single key value pair [letter: [Array of contacts]]
var result = [[String: [Contact]]]()
for letter in alphabet
{
result.append([letter: contacts(beginningWith: letter, from: allContacts)])
}
return result
}
func contacts(beginningWith prefix: String, from contactList: [Contact]) -> [Contact] {
//you could use a filter here for brevity, e.g.
//let contacts = contactList.filter { $0.name.capitalized.hasPrefix(prefix) }
//this is short enough to reasonably be used at the call site and not within a function
var contacts = [Contact]()
for contact in contactList {
if contact.name.capitalized.hasPrefix(prefix) {
contacts.append(contact)
}
}
return contacts
}
let contacts = [Contact(name: "Bob"), Contact(name: "Kate"), Contact(name: "Darling")]
let filteredArray = filterArrayAlphabatically(contacts: contacts)
print(filteredArray)
//[["A": []], ["B": [Contact(name: "Bob")]], ["C": []], ["D": [Contact(name: "Darling")]], ["E": []], ["F": []], ["G": []], ["H": []], ["I": []], ["J": []], ["K": [Contact(name: "Kate")]], ["L": []], ["M": []], ["N": []], ["O": []], ["P": []], ["Q": []], ["R": []], ["S": []], ["T": []], ["U": []], ["V": []], ["W": []], ["X": []], ["Y": []], ["Z": []]]
和addClass()
方法。
但是,我遇到了一个小问题,该方法最初会很好用,但在第一次添加/切换之后,新类的前面会增加空格(或者背后原始课程。)
对于示例:
toggleClass()
显然不是它应该如何运作,但我无法找到一种方法来修复它而不会破坏我的<!-- initial toggle / add (this is what I wanted everytime) !-->
<div class="firstclass toggledclass"></div>
<!-- after initial toggle, THEN the new class is removed (this is what I'm left with) !-->
<div class="firstclass "></div>
<!-- after initial toggle / add (when I add a new class back in again) !-->
<div class="firstclass toggledclass"></div>
<!-- and so on... !-->
。
这是我的(相关) JavaScript :
script
我还是 JavaScript 的新手,所以大部分内容都来自我发现的改变// add class
for(var i = 0; i < this.element.length; i++){
if((" " + this.element[i].className + " ").indexOf(" " + classes + " ") < 0){
this.element[i].className += " " + classes; // i feel the problem retains here
}
}
// toggle class
for(var i = 0; i < this.element.length; i++){
if(this.element[i].classList.contains(classes)){
var regex = new RegExp("(^| )" + classes + "($| )", "g");
for(var i = 0; i < this.element.length; i++){
this.element[i].className = this.element[i].className.replace(regex, " ");
}
} else {
if((" " + this.element[i].className + " ").indexOf(" " + classes + " ") < 0){
this.element[i].className += " " + classes; // and here
}
}
}
(我想偏离scripts
新方法来自论坛的classList
,.add()
等。)
如果有人可以帮我弄清楚如何解决这个问题/改进这段代码,那么非常赞赏,
答案 0 :(得分:3)
也许直接使用空格来尝试将所有类放入数组并在数组上工作。它会起作用
var classStr = el.getAttribute('class');
var classes = classStr.split(" ");
将类推送到数组之后执行join方法。
所以,如果你想要在数组中添加新类,我首先会看看类是否已经在
if(classes.indexOf("class") == -1) {
classes.push("class");
}