Создать сайт, Создать сайт Воронеж, Moguta CMS, Wlad007 для Moguta CMS, Настройка и установка интернет-магазинов и лендингов на Moguta.CMS, Редактирование шаблонов и плагинов интернет-магазинов на Moguta
Вернуться к списку статей

Выполнение 2 команд по одной кнопке

Выполнение 2 команд по одной кнопке
Для выполнения двух команд по одной кнопке вам нужно создать скрипт на JavaScript, который будет реагировать на нажатие данной кнопки и соответственно выполнять нужные действия.

HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<input class="default-btn"  type="button" value="Нажми" id="w007_button">
CSS
.default-btn {
	    cursor: pointer;
    font-size: 16px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 40px;
    padding: 0 36px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: color .3s, background .3s, box-shadow .3s;
    -webkit-transition: color .3s, background .3s, -webkit-box-shadow .3s;
    -o-transition: color .3s, background .3s, box-shadow .3s;
    transition: color .3s, background .3s, -webkit-box-shadow .3s;
    transition: color .3s, background .3s, box-shadow .3s;
    transition: color .3s, background .3s, box-shadow .3s, -webkit-box-shadow .3s;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    color: #fff;
    border-radius: 30px;
    background: #222;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
JS
$ = jQuery;
// Toggle Click
jQuery.fn.toggleClick = function (a, b) {
	return this.on("click", function (ev) {
		[b, a][(this.$_io ^= 1)].call(this, ev);
	});
};

$(function () {
	$("#w007_button").toggleClick(
		function () {
			$(this).val("выполнена 1я команда");
		},
		function () {
			$(this).val("выполнена 2я команда");
		}
	);
});
И смотрим что получилось