При выборе опции - свернуть список и отобразить выбранный элемент

271

08 мая 2017, 01:25

Нужно что бы при выборе одного элемента из списка сам список сворачивался, а элемент стал на место <span>.

  $(document).ready(function() { 
    $('.dropdown').click(function() { 
      $("li").toggle(300); 
    }); 
  });

<!DOCTYPE html> 
<html> 
 
<head> 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
</head> 
 
<body> 
  <div class="wrappeerDropdown"> 
    <ul> 
      <span class="dropdown">Select</span> 
      <li> 
        <a>Max</a> 
      </li> 
      <li> 
        <a>Rex</a> 
      </li> 
      <li> 
        <a>Wex</a> 
      </li> 
    </ul> 
  </div> 
</body> 
 
</html>

Answer 1

Попробуйте так:

  $(document).ready(function() { 
    $('.list li').click(function() { 
     $('.dropdown').html($(this).text()); 
      $(".list").toggle(300); 
    }); 
  });

<!DOCTYPE html> 
<html> 
 
<head> 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
</head> 
 
<body> 
  <div class="wrappeerDropdown"> 
   <span class="dropdown">Select</span> 
    <ul class="list"> 
      <li> 
        <a>Max</a> 
      </li> 
      <li> 
        <a>Rex</a> 
      </li> 
      <li> 
        <a>Wex</a> 
      </li> 
    </ul> 
  </div> 
</body> 
 
</html>