Вопрос переменной JS

Question

У меня очень простая функция js для переключения видимости div, вот рабочая версия:

function Toggle(obj) {   
    var state = document.getElementById(obj);
    if (state.style.display === 'block') {
        state.style.display = 'none';
    }
    else {
        state.style.display = 'block';
    }
}

Здесь obj представляет идентификатор div.Теперь у меня есть несколько div на странице, и я хочу, чтобы, когда пользователь открывает новый div, ранее закрытый div закрывался.Я попытался сделать это, изменив мою функцию следующим образом:

var prev_obj = 'empty';

 function Toggle(obj) {  
    var state = document.getElementById(obj);
    if (state.style.display === 'block') {
        state.style.display = 'none';
    }
    else {

                if (prev_obj !== 'empty')
                {
        var prev_state = document.getElementById(prev_obj)
        prev_state.style.display = 'none';
                }       
        state.style.display = 'block';

                prev_obj = obj;
    }
}

Я полагаю, что это самоочевидно для мастеров js, поэтому я просто скажу, когда я жестко закодирую значение для prev_objэто работает, но когда я этого не делаю, и firebug показывает, что он сохраняет начальное значение («пусто»)

Помощь оценена так же, как и любой другой способ сделать это, если он у вас есть.

Answer 1

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

С другой стороны, вы можете немного упростить логику, если считаете, что то, что вы хотите, это то же самое, что сказать: " закройте предыдущий div, несмотря ни на что (в том числе, если он совпадает с текущим div) и открывать текущий div, только если он отличается от предыдущего".

Я бы также сохранил фактический элемент в prev_obj вместо идентификатора и первоначально установил бы его на null. Это упростит тестирование, если было prev_obj, а также позволит вам использовать идентификатор «пусто», если это необходимо (конечно, вы, вероятно, не будете, но только лучшие практики).

var prev_obj = null;

function Toggle(id) { // Call it "id" to be clear it's not the actual object
   // Hide previous object if it exists
   if (prev_obj) prev_obj.style.display = 'none';

   // Show current object if it's the same as the previous one
   var obj = document.getElementById(id);
   if (obj !== prev_obj) {
      obj.style.display = 'block';
      prev_obj = obj;
   }
}

Убедитесь, что вы называете это, включив одинарные кавычки вокруг идентификатора:

<div onclick="Toggle('div-id-here')"></div>

Answer 2

Трудно сказать, где ваша проблема, по предоставленным деталям.Вы должны быть в состоянии разработать решение с помощью учебника, связанного ниже.Лично я бы перебрал все элементы div, спрятал их все, а затем показал бы текущий, вместо того, чтобы хранить ссылку на последний div.