0

Как сделать, чтобы при нажатии на класс:

<form class="ch" action="" method="post">
        <button class="button orange" type="submit" name="on" onClick="init()">Įjungti serverį</button>
</form>

его заменило на:

<button class="button grey">Serveris jau įjungtas</button>

? Пробовал:

function init() {
    $('.ch').replaceWith("<button class="button grey">Serveris jau įjungtas</button>");
}

и

$('.ch').click(function(){
    $(this).remove();
});

но почему-то не работает. Нет никакой реакции. Кнопка запускает процесс:

if(isset($_POST['on'])) { 
     $output = shell_exec('bash /var/www/CP/server.sh start');
}
4
  • $('button[class="button orange"]').onclick(function() { $(this).removeClass("orange"); $(this).addClass('grey'); }); я бы сделал так Commented 30 июн. 2016 в 11:35
  • Кнопку вместе с form надо заменить или только кнопку внутри?
    – Doofy
    Commented 30 июн. 2016 в 11:36
  • @BogdanGudyma, не работает.
    – ES.
    Commented 30 июн. 2016 в 11:42
  • @Doofy, нужно убрать кнопку вместе с формой, а вместо нее вывести просто класс (другой)
    – ES.
    Commented 30 июн. 2016 в 11:43

2 ответа 2

1
<button class="button orange" onclick='init(this)'>server</button>
function init(e) {
    xhr = new XMLHttpRequest();
    xhr.open('POST', 'a.php', true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send('on=');
    xhr.onreadystatechange = function() {
        if(xhr.readyState == 4) {
            if(xhr.status == 200) {
                console.log(xhr.responseText);
            }
        }
    }

    e.outerHTML = '<button class="button grey">Serveris jau įjungtas</button>';
}

a.php

if(isset($_POST['on'])) { 
    $output = shell_exec('bash /var/www/CP/server.sh start');
    echo $output;
}

Пример без JavaScript на одном php

if(isset($_POST['on'])) {
    $output = shell_exec('bash /var/www/CP/server.sh start');
    echo "<button class='button grey'>Server is jau įjungtas</button>";
} else {
    echo "<form action='' method='POST'>
        <button class='button orange' name='on'>Įjungti serverį</button>
    </form>";
}
11
  • Почему то не работает
    – ES.
    Commented 30 июн. 2016 в 11:46
  • @ES., потому что страница обновляется из-за формы после нажатия. Здесь в снипете код работает, потому что страница не обновляется. Нужно идти в сторону запросов
    – Doofy
    Commented 30 июн. 2016 в 11:47
  • что конкретно нужно делать с запросами?
    – ES.
    Commented 30 июн. 2016 в 11:49
  • @ES., form отправляет запрос с обновлением странички. Если нужен запрос, можно освободить кнопку от формы и сделать запрос в скрипте. Для чего здесь form в скрипте?
    – Doofy
    Commented 30 июн. 2016 в 11:51
  • было бы хорошо, не подскажите как внедрить этот php скрипт? Я думаю форма не нужна, по другому я не знаю как реализовать
    – ES.
    Commented 30 июн. 2016 в 11:52
1

Примерно так :

$(function() {
  $("#mybutton ").click(function() {
    $(this).removeClass('grey').addClass( "red" )
    $(this).text("Уже включено")
  });
});
.grey {
  background: grey;
}
.red {
  background: red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="button grey" id="mybutton">Выключено</button>

3
  • Это не то, что мне нужно. Я хочу заменить форму с классом на другой класс, без формы.
    – ES.
    Commented 30 июн. 2016 в 11:44
  • Вы хотите удалить форму?
    – koks_rs
    Commented 30 июн. 2016 в 11:45
  • Да, хочу удалить форму с классом и показать другой класс.
    – ES.
    Commented 30 июн. 2016 в 11:46

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.