Компактная запись функции
Есть функция, а точнее портянка:
app.ratingTooltipTpl = function (e) {
var res = "<div id='set-rating" + e.chainId + "'>";
var rate = e.rating;
switch (rate) {
case 0:
for (var i = 1; i <= 5; ++i) {
res += "<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>";
}
break;
case 1:
res += "<span rate=1 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
for (var i = 2; i <= 5; ++i) {
res += "<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>";
}
break;
case 2:
res += "<span rate=1 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=2 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
for (var i = 3; i <= 5; ++i) {
res += "<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>";
}
break;
case 3:
res += "<span rate=1 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=2 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=3 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
for (var i = 4; i <= 5; ++i) {
res += "<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>";
}
break;
case 4:
res += "<span rate=1 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=2 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=3 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=4 chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
res += "<span rate=5 chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>";
break;
case 5:
for (var i = 1; i <= 5; ++i) {
res += "<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-yellow-star' onclick='setRating(this)'></span>";
}
break;
}
res = res + "</div></br>Баллы:<span id='rating-rate" + e.chainId + "'>"+rate+"</span>";
return res;
};
Возможно ли её упростить, укоротить, записать более компактно, использую jqerry? |
В каждом кейсе создаётся по 5 спанов, отличающихся только аттрибутом rate (от 1 до 5) и class(либо action-tooltip rating-yellow-star, либо action-tooltip rating-empty)
|
AlexTrader, Вы не так давно задавали похожий вопрос.
Почему нельзя проанализировать код, понять что у Вас постоянно повторяется, а какие данные статичны и на основе полученных результатов написать алгоритм, который будет выглядеть в 10 раз компактнее и выполнять эту же работу, но в единственном цикле? В jQuery нет методов, способных выполнить эту же работу. |
Nexus,
Сложность в том, что элементы не полностью повторяются, два аттрибута разные... |
Цитата:
https://javascript.ru/forum/misc/699...tml#post460507 Разное значение принимает 1 атрибут и свойство. |
Цитата:
Как вариант, сделай массив объектов, где у свойств будут нужные значения. Т.о. останется просто собрать нужную строку с использованием нужного элемента массива... |
Цитата:
|
Цитата:
|
Сделал так:
app.ratingTooltipTpl = function (e) {
var res = "<div id='set-rating" + e.chainId + "'>";
var rate = e.rating;
var spanArr = [];
for (var i = 1; i <= 5; ++i) {
spanArr.push("<span rate=" + i + " chainId=" + e.chainId + " class='action-tooltip rating-empty' onclick='setRating(this)'></span>");
}
switch (rate) {
case 1:
spanArr[0].replace("empty", "yellow-star");
break;
case 2:
spanArr[0].replace("empty", "yellow-star");
spanArr[1].replace("empty", "yellow-star");
break;
case 3:
spanArr[0].replace("empty", "yellow-star");
spanArr[1].replace("empty", "yellow-star");
spanArr[2].replace("empty", "yellow-star");
break;
case 4:
spanArr[0].replace("empty", "yellow-star");
spanArr[1].replace("empty", "yellow-star");
spanArr[2].replace("empty", "yellow-star");
spanArr[3].replace("empty", "yellow-star");
break;
case 5:
spanArr[0].replace("empty", "yellow-star");
spanArr[1].replace("empty", "yellow-star");
spanArr[2].replace("empty", "yellow-star");
spanArr[3].replace("empty", "yellow-star");
spanArr[4].replace("empty", "yellow-star");
break;
}
var spans = spanArr.join();
res += spans;
res = res + "</div></br>Баллы:<span id='rating-rate" + e.chainId + "'>"+rate+"</span>";
return res;
};
Между спанами запятые выводятся... |
Поправил
var spans = spanArr.join("");
|
| Часовой пояс GMT +3, время: 07:04. |