Попытка уменьшить повторение JavaScript с помощью переменной - PullRequest
Новая
       16

Попытка уменьшить повторение JavaScript с помощью переменной

1 голос
/ 26 июня 2011

Я пытаюсь уменьшить количество повторений в моем коде, но безуспешно.Я сократил код до его самой простой функциональности, чтобы попытаться заставить его работать.

Идея состоит в том, чтобы взять последние две буквы имени идентификатора, поскольку эти буквы совпадают с ранее объявленной переменной и используютэто ссылка на старую переменную.

Я использовал alert , чтобы проверить, правильно ли я получаю вывод, и всплывающее окно с сообщением «E1».Поэтому я не совсем уверен, почему он не работает, когда я пытаюсь его использовать. 

E1 = new Audio('audio/E1.ogg');

$('#noteE1').click(function() {
    var fileName = this.id.slice(4);
    //alert(fileName); used to test output
    fileName.play();
    $('#note' + fileName).addClass('active');
});

Блок кода работает, когда я использую исходную переменную E1 вместо fileName .Я хочу использовать fileName , потому что я надеюсь, что эта функция будет работать для нескольких элементов при нажатии, вместо того, чтобы повторять ее для каждого элемента.

Как я могу сделать эту работу?Чего мне не хватает?

Спасибо.

1 Ответ

5 голосов
/ 26 июня 2011

fileName по-прежнему строка . JavaScript не знает, что вы хотите использовать переменную с тем же именем. Вы вызываете метод play() для строки, которая, конечно, не существует (следовательно, вы получаете ошибку).

Предложение:

Храните ваши объекты в таблице: 

var files = {
    E1: new Audio('audio/E1.ogg')
};

$('#noteE1').click(function() {
    var fileName = this.id.slice(4);
    //alert(fileName); used to test output
    files[fileName].play();
    $('#note' + fileName).addClass('active');
});

Еще одно предложение:

Вместо использования идентификатора для хранения информации о файле рассмотрите возможность использования HTML5 data атрибутов : 

<div id="#note" data-filename="E1">Something</div>

Тогда вы можете получить имя с помощью: 

var filename = $('#note').data('filename');

Это делает ваш код более гибким. Вы не зависите от присвоения элементам идентификатора в определенном формате.

...