Я думаю, это то, что вам нужно! Вот то, что я использовал в демо-версии несколько лет go, вы можете редактировать ее в соответствии с вашими требованиями.
Добавьте свой URL-адрес для обновления в тексты, подобные мне, и удалите.
$(document).ready(function () {
$(".like button").click(function () {
if ($(this).hasClass('btn')) {
$(this).html('remove').toggleClass('btn mybtn');
} else {
$(this).html('Like me').toggleClass('mybtn btn');
}
});
});
.mybtn {
color: red;
}
.btn {
color: green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="like">
<p>Like</p>
<button class="btn">Like me</button>
</div>
Демо
ОБНОВЛЕНИЕ: Извините, я был далеко от р c! это должно быть очень просто ввести в ваши коды:
Я полагаю, ваши php коды находятся в вашем favs.php
Я пытался вот так для ответа в favs.php
echo 'response';
Html кнопка! Вы можете изменить свой класс:
$(document).ready(function () {
$(".button").click(function (e) {
e.preventDefault();
const user_id = $(this).attr('data-user-id');
const director_id = $(this).attr('data-director-id');
const method = $(this).attr('data-method');
if (method === "Like") {
$(this).html('<i class="mi mi_sml text-danger" id="' + director_id + '">favorite</i>Remove Favorite').toggleClass('button mybtn');
//Change remove text to your i class
} else {
$(this).html('<i class="mi mi_sml" id="' + director_id + '">favorite_border</i>Add Favorite').toggleClass('mybtn button');
//Change Like me text to your i class
//you can remove or edit class mybtn in both remove and like
}
$.ajax({
url: 'favs.php',
type: 'GET', // type not method
data: {user_id: user_id, director_id: director_id, method: method},
cache: false,
success: function(data) {
alert(data);
}
});
});
});
.mybtn {
color: red;
}
.btn {
color: green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="like">
<p>Like</p>
<button type="submit" class="btn">Like me</button>
</div>
У меня могут быть некоторые ошибки, такие как имя класса et c ... вы можете отредактировать и сделать его подходящим для ваших требований.
Я проверил его работоспособность. решено