Аккордная диаграмма - пройдите по клавише с нажатием

Question

У меня есть приложение диаграммы аккордов, которое в принципе может переносить диаграмму аккордов вверх и вниз по всем клавишам, но теперь я хотел бы расширить это приложение и позволить кому-то выбрать ключ и автоматически перейдите к этому ключу при событии клика, используя функцию в javascript или jquery. Может кто-нибудь помочь мне понять это? Логика кажется достаточно простой, но я просто не уверен, как ее реализовать. Вот мои текущие функции, которые позволяют пользователю переносить вверх и вниз ...

var match; 
var chords = ['C','C#','D','D#','E','F','F#','G','G#','A','A#','B','C','Db','D','Eb','E','F','Gb','G','Ab','A','Bb','B','C']; 
var chords2 = ['C','Db','D','Eb','E','F','Gb','G','Ab','A','Bb','B','C','C#','D','D#','E','F','F#','G','G#','A','A#','C']; 
var chordRegex = /(?:C#|D#|F#|G#|A#|Db|Eb|Gb|Ab|Bb|C|D|E|F|G|A|B)/g; 

function transposeUp(x) { 
    $('.chord'+x).each(function(){ ///// initializes variables ///// 
    var currentChord = $(this).text(); // gatheres each object 
    var output = "";  
    var parts = currentChord.split(chordRegex);  
    var index = 0;   
    /////////////////////////////////   
    while (match = chordRegex.exec(currentChord)){    
    var chordIndex = chords2.indexOf(match[0]);    
    output += parts[index++] + chords[chordIndex+1]; 
    }   
    output += parts[index];  
    $(this).text(output);  
    }); 
} 

---

function transposeDown(x){ 
    $('.chord'+x).each(function(){ 
    var currentChord = $(this).text(); // gatheres each object 
    var output = ""; 
    var parts = currentChord.split(chordRegex); 
    var index = 0; 
    while (match = chordRegex.exec(currentChord)){ 
     var chordIndex = chords2.indexOf(match[0],1); 
     //var chordIndex = $.inArray(match[0], chords, -1); 
     output += parts[index++] + chords2[chordIndex-1]; 
    } 
    output += parts[index]; 
    $(this).text(output); 
}); 
} 

Любая помощь приветствуется. Ответ будет принят! Спасибо

Answer 1

Это все, что вам нужно? функция, которая создаст событие click?

$('[class^="chord"]').click(function() { 
    alert($(this).text() + ' clicked'); 
}); 

Основываясь на ваш комментарий: Вот некоторые псевдо-код, чтобы вы идете в правильном направлении:

• также хранить транспонированной версии каждого хорд массива
• когда примечание щелкнуть мышью, найти его элемент в исходном массиве аккордов (используя $(this).text() выше, чтобы соответствовать названию ноты)
• Когда совпадение найдено, вы можете найти его транспонированную версию, используя тот же индекс массива