Показать сообщение отдельно
  #3 (permalink)  
Старый 20.05.2018, 19:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Black_Star,
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <style>
    .btn_sorted__mobile {
        border: 1px solid #000;
        padding: 5px;
    }
    .bl_sortField{
        width: 300px;
        min-height: 300px;
        border: 1px solid #f00;
    }
    .test{
        display: block;
        margin-bottom: 5px;
        color: #f00;
    }
</style>
</head>


<body>
    <button class="btn_sorted__mobile" type="button">Сортировать</button>

    <div class="bl_sorter">
        <select class="bl_sorter__select js-mainSorter" onchange="location = this.value;">
            <option value="http://test1">По популярности</option>
            <option value="http://test2">Название (А - Я)</option>
            <option value="http://test3">Название (Я - А)</option>
            <option value="http://test4">Сначала подешевле</option>
            <option value="http://test5">Сначала подороже</option>
        </select>
    </div>
    <div class="bl_sortField"></div>
    <script>
        window.onload = function () {
            var btnSorted = $(".btn_sorted__mobile"),
            blockSortField = $(".bl_sortField");
            btnSorted.one('click', function(){
                $(".js-mainSorter option").each(function(){
                blockSortField.append('<a class="test" href=" ' + this.value +' " >' + this.text + '</a>') });
            });
        }
    </script>
</body>
</html>
Ответить с цитированием