превратить ячейку таблицы в ссылку
Господа, программисты! У меня такой вот интересный вопрос: Таблица создана и заполнена объектом, т.е. без тегов html... как сделать ячейку ссылкой?
<table id="myTable" border="1" cellpadding="10" cellspacing="0">
<tr>
<th id="ID">ID</th>
<th id="idPdt">Имя</th>
<th id="pdtDescriprion">Описание</th>
<th id="pdtPrice">Цена</th>
<th id="pdtQuantity">Количество</th>
</tr>
</table>
<script>
for (property in Store) {
var tr = '<tr>'; // создаем строку таблицы
Store[property].forEach(function(item) {
tr += '<td>' + item + '</td>'; // добавляем столбцы в строку
});
tr += '</tr>'; // закрываем строку таблицы
$('#myTable > tbody:last-child').append(tr); // добавляем полученную строку в дом
}
var s = [Store.str1[1], Store.str2[1], Store.str3[1]];
var m1 = Store.str1,
m2 = Store.str2,
m3 = Store.str3;
console.log(m3[4]);
</script>
Объект :
ar Store = {
str1: ['1','Ноутбук Lenovo', 'Ноутбук ThinkPad T460 14"FHD(1920x1080),i5-6200U(2,3GHz),4Gb,500GB@5400+8Gb cache, HD Graphics 520, WiFi,BT,TPM,FPR,WWAN ready,3cell+3cell,Cam,Win7 Pro 64 + Win10 Pro upgrade coupon,1,7kg, 3y OS', '100','2'],
str2: ['2', 'Клавиатура OKLICK', 'Клавиатура OKLICK 140M, USB, черный', '50', '8'],
str3: ['3', 'Сетевой адаптер', 'Сетевой адаптер WiFi D-Link DWA-582 DWA-582/RU', '7', '0']
}
:help: :help: :help: :help: :help: |
Влад137,
результат который хотите получить? |
рони,
нужно чтобы весь второй столбец был ссылкой |
Цитата:
|
рони,
Так , примера нет , постараюсь словами описать... есть таблица, и нам нужно чтобы все элементы второго столбика , они же [1] элементы массивов свойств объекта Store были ссылочного типа, то есть при нажатии на текст из второго столбика можно было перейти на другую страницу "карточка товара" . Остальные все элементы таблицы обычный текст. |
Влад137,
опишите в объекте ссылки, если только путь не один и по параметру запрос. Выводя в ячейку текст из объекта добавляйте сразу эту ссылку тексту. |
laimas,
не совсем понял как это описать ссылку в объекте( |
Влад137,
то есть как выглядит ваша ссылка вы написать не в состоянии? тег <a href=""></a> |
рони,
ахах ...неверно понял вопрос.. тут я конечно в состоянии, пардоньте) <a href="Карточка товара.html"></a> |
Влад137,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
var Store = {
str1: ['1','Ноутбук Lenovo', 'Ноутбук ThinkPad T460 14"FHD(1920x1080),i5-6200U(2,3GHz),4Gb,500GB@5400+8Gb cache, HD Graphics 520, WiFi,BT,TPM,FPR,WWAN ready,3cell+3cell,Cam,Win7 Pro 64 + Win10 Pro upgrade coupon,1,7kg, 3y OS', '100','2'],
str2: ['2', 'Клавиатура OKLICK', 'Клавиатура OKLICK 140M, USB, черный', '50', '8'],
str3: ['3', 'Сетевой адаптер', 'Сетевой адаптер WiFi D-Link DWA-582 DWA-582/RU', '7', '0']
}
var tbody = $("#myTable tbody");
Object.keys(Store).forEach(function(key) {
var tds = Store[key];
var tr = $("<tr/>").appendTo(tbody);
tds.forEach(function(text, i) {
var obj = {
text: text
};
if (i == 1) obj = {
html: $("<a/>", {
href: text+".html",
text: text
})
};
var td = $("<td/>", obj).appendTo(tr)
})
});
});
</script>
</head>
<body> <a href=""></a>
<table id="myTable" border="1" cellpadding="10" cellspacing="0">
<tr>
<th id="ID">ID</th>
<th id="idPdt">Имя</th>
<th id="pdtDescriprion">Описание</th>
<th id="pdtPrice">Цена</th>
<th id="pdtQuantity">Количество</th>
</tr>
</table>
</body>
</html>
|
| Часовой пояс GMT +3, время: 09:33. |