Изменить цвет фона назад jquery

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

вот мой код

<form id="form1" runat="server"> 
<div> 

    <link href="Content/TreeViewCss.css" rel="stylesheet" /> 
<div class="tree well"> 
    <ul> 
     <li style="width: 100%"> 
      <span ><i class="icon-folder-open"></i>Parent</span> 
      <ul style="width: 100%"> 
       <li> 
        <span><i class="icon-minus-sign"></i>Child</span> 
        <ul> 
         <li> 
          <span><i class="icon-leaf"></i>Grand Child</span> 
         </li> 
        </ul> 
       </li> 
       <li> 
        <span><i class="icon-minus-sign"></i>Child</span> 
        <ul> 
         <li> 
          <span><i class="icon-leaf"></i>Grand Child</span> 
         </li> 
         <li> 
          <span><i class="icon-minus-sign"></i>Grand Child</span> 
          <ul> 
           <li> 
            <span><i class="icon-minus-sign"></i>Great Grand Child</span> 
            <ul> 
             <li> 
              <span><i class="icon-leaf"></i>Great great Grand Child</span> 
             </li> 
             <li> 
              <span><i class="icon-leaf"></i>Great great Grand Child</span> 
             </li> 
            </ul> 
           </li> 
           <li> 
            <span><i class="icon-leaf"></i>Great Grand Child</span> 
           </li> 
           <li> 
            <span><i class="icon-leaf"></i>Great Grand Child</span> 
           </li> 
          </ul> 
         </li> 
         <li> 
          <span><i class="icon-leaf"></i>Grand Child</span> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </li> 
     <li> 
      <span><i class="icon-folder-open"></i>Parent2</span> 
      <ul> 
       <li> 
        <span><i class="icon-leaf"></i>Child</span> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</div> 

</div> 
</form>

и сценарий JQuery изменить цвет

<script> 
    $("span").click(function() { 

     $(this).css("background-color", "gray"); 
    }); 
</script>

Я использую ASP.NET WebForms и все библиотеки Jquery включены уже.

источник

2014-09-04 nanobots

Вы можете достаточно добавить класс с помощью CSS, а затем переключить его с помощью addClass() и removeClass():

для добавления и удаления класса:

$("span").click(function() { 
    $("span").removeClass("greybg"); 
    $(this).addClass("greybg"); 
});

CSS:

.greybg{background-color:gray}

источник

2014-09-04 14:35:26

Означает ли это, что, когда вы делаете removeeclass («greybg»), он удаляет css «greybg» во ВСЕЙ диапазон? – nanobots

@ пользователь2948725: да это будет. или другим способом, вам нужно изменить селектор, чтобы настроить только требуемые интервалы/интервалы. –

Это не исправляет мою проблему. Я понимаю, что вы здесь делаете, но проблема в том, что мне нужно УДАЛИТЬ css, примененный к прозрачному диапазону после того, как я нажму другой диапазон. в этом случае он не удаляет предыдущий фон. Я хочу сначала снять предыдущий цвет фона, применяемый к другому диапазону. Затем примените css к текущему диапазону – nanobots

Самый простой, быстрый и лучший способ сделать это - использовать рычаги CSS и просто добавить/удалить класс.

.BackgroundGray { 
    background-color:gray 
}

Затем добавить класс в JQuery:

$(this).addClass('ButtonGray');

Затем удалить класс позже с каким-либо другим событием:

$(this).removeClass('ButtonGray');

Простой, чистый и расширяемым.

источник

2014-09-04 14:36:11 PlantTheIdea

Просто используйте этот

JavaScript

$("span").click(function() { // use selector as per your requirement instead of span may be some class 
    $('.greybgByJs').removeClass("greybgByJs"); 
    $(this).addClass("greybgByJs"); 
});

Css

.greybgByJs{background-color:gray}

Таким образом, только последний клике элемент будет иметь серый фон

источник

2014-09-04 14:42:39 Sauryabhatt

Изменить цвет фона назад jquery

ответ

Смежные вопросы