Вопросы Теги

Как изменить CSS документа в соответствии с результатом пункта в Jquery?

Я новичок в stackoverflow, я создаю чат и хочу изменить стили,

, в зависимости от значения, которое элемент возвращает мне.

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

            <script>
        var from = null, start = 0, url = 'chatmsj.php';
        $(document).ready(function () {
            from = prompt("Escribe tu nombre malandro, pa probar esta vaina");
            load();

            $('form').submit(function (e) {
                $.post(url, {    
                    message: $('#message').val(),
                    from: from
                });
                $('#message').val('');
                return false;

            })
         });

            function load(){
                $.get(url + '?start=' + start, function(result){
                    if(result.items){
                        result.items.forEach(item =>{
                            start = item.id;
                            $('#messages').append(renderMessage(item));
                        });
                        $('#messages').animate({scrollTop: $('#messages')[0].scrollHeight});
                    };
                    load();
                });
            }

            function renderMessage(item){
                let time = new Date(item.created);
                time = `${time.getHours()}:${time.getMinutes() < 10 ? '0' : ''}${time.getMinutes()}`;


                return `<div class="msg"><p>${item.from}</p>${item.message}<span>${time}</span></div>`;
            }



        </script>
<style>
    body {
        margin: 0;
        overflow: hidden;
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    }

    #messages {
    height: 88vh;
    overflow-x: hidden;
    padding: 10px
    }

    form {
        display: flex
    }

    input {
        font-size: 1.2rem;
        padding: 10px;
        margin: 10px 5px;
        appearance: none;
        -webkit-appearance: none;
        border: 1px solid #ccc;
        border-radius: 5px
    }
    #message {
        flex: 2
    }
    .msg {
        background-color: #dcf8c6;
        padding: 5px 10px;
        border-radius: 5px;
        margin-bottom: 8px;
        width: fit-content
    }
    .msg p {
        margin: 0;
        font-weight: bold
    }
    .msg span {
        font-size: 0.7rem;
        margin-left: 15px
    }
    </style>

    </head>

    <body>
        <div id="messages">

        </div>
        <form>
            <input type="text" id="message" autocomplete="off" autofocus placeholder="Escribe tu mensaje...">
            <input type="submit" value="Enviar">
        </form>

Я хочу иметь возможность изменить стиль, например, я хочу отправлять сообщения, такие как ADMIN, в чат, и этот ADMIN имеет цвет фона, отличный от цвета других элементов чата.

Я новичок в jquery. Я болтал с ajax и php, обновляя в сети запросы каждый момент, но очевидно, что это взорвет сервер.

Приветствую, и я надеюсь, что вы мне поможете.

0
задан 28.11.2019, 03:03
1 ответ

Чтобы менять css селектора с jquery ты можешь использовать ее funciГіn .css (). Пример: $(".selectorPrueba").css("color","black") оставил Тебе doc: https://api.jquery.com/css / . В любом случае, я советую тебе издавать твой вопрос и aГ±adir один pequeГ±o простой пример того, что ты хочешь с https://jsfiddle.net / для того, чтобы он был mГЎs ясная.

0
ответ дан 01.12.2019, 10:43
  • 1
    Привет, на самом деле большое спасибо отвечать из-за меня. если, я знаю css (), но не, как расположение в порядке этого, код, который я переслал, - чата, которого я делаю, но хочу, что, когда, когда я буду говорить с кем-то, например JUAN (я) ПЕДРО (друг), div, который возвращает RETURN, изменит цвет и характеристики как стоимость, которая у него есть {item:from}. ¿ Я объяснился хорошо?. –  Juan P Mora 29.11.2019, 01:29

Теги

Похожие вопросы