проблема с тегами div - PullRequest
Новая
       1

проблема с тегами div

0 голосов
/ 22 августа 2011

У меня есть следующий код 

<HTML>
<HEAD>
<style type="text/css">
.setbgcolor{
background-color:blue;

}

</style>
<script type="text/javascript">
function setbg(id){
document.getElementById(id).className = "setbgcolor";

}
</script>
</HEAD>
<BODY>
<div onclick="setbg(this.id)" id="bgcolor">Label1</div>
<div>Label2</div>
</BODY>
</HTML>

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

Ответы [ 3 ]

1 голос
/ 22 августа 2011

Нет такого события, как, возможно, onunclick в JavaScript; есть blur / onblur, но для этого требуется, чтобы элемент имел фокус, прежде чем его можно будет запустить.

Тем не менее, работая в предположении, что вы хотите, чтобы только один div был выделен в любое время, следующие работы, хотя вам придется адаптировать его к вашим конкретным потребностям: 1011 * 

var buttons = document.getElementsByClassName('button'), curHighlights;

for (i=0; i<buttons.length; i++){
    buttons[i].onclick = function(){
        curHighlights = document.getElementsByClassName('bgcolor');
        if (curHighlights.length) {
            for (h=0; h<curHighlights.length; h++){
                // warning: the following removes _all_ class-names
                curHighlights[h].removeAttribute('class');
            }
        }
            this.className = 'bgcolor';
            this.setAttribute('data-state','1');

    };
}

Демонстрация JS Fiddle .

Я удалил обработчики событий onclick из встроенного html, что облегчает его обслуживание, хотя выглядит довольно грязно.

Однако для сравнения с jQuery вышеприведенное можно сжать до: 

$('.button').click(
    function(){
        $('.bgcolor').removeClass('bgcolor');
        $(this).addClass('bgcolor');
    });

JS Fiddle demo .

0 голосов
/ 22 августа 2011

Вероятно, вам нужно что-то вроде переменной, которая хранит ранее нажатый div.

Например: 

var previouslyClickedDiv = null;

function setbg(id){
    if (previouslyClickedDiv) { previouslyClickedDiv.className = ""; }
    var div = document.getElementById(id);
    div.className = "setbgcolor";
    previouslyClickedDiv = div;
}

Конечно, вы можете использовать более короткое имя переменной!

0 голосов
/ 22 августа 2011

Попробуйте взглянуть на jQuery .Это сделает вашу жизнь проще.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...