Работа с checkbox
Доброго времени суток. Есть задание:
a. Создать таблицу со списком товаров/объектов. Одну графу выделить под хранение отметок о выборе товара. Под таблицей разместить четыре кнопки: вверх, вниз, отметить, передать. b. Текущий элемент таблицы должен быть отмечен другим цветом c. При нажатии на кнопки вверх, вниз текущим становится элемент вверху/внизу от текущего. d. При нажатии на кнопку отметить в соответствующей графе таблицы должна появляться/сниматься отметка. e. При нажатии на кнопку передать должно появляться новое окно, в котором будет отображен список выбранных товаров. f. Сделать отработку нажатий мыши – строка таблицы должна выбираться по щелчку мыши на ней. На данный момент пытаюсь активные checkbox открыть в новой вкладке. Вот что пишу, но не работает=( пока просто пытаюсь показать хотя бы активные и вывести сообщение при нажатии на кнопку...alert() не работает. А по-хорошему при нажатии на кнопку надо активные checkbox вывести в новой вкладке. Как решить проблему? <div style="float: left; margin-right: 50px;" class="box4">
<p><b>Товары</b></p>
<table style="width: 270px; height: 350px; border: 1px solid gray;">
<tr>
<td>
<input type="checkbox" value=Яблоки name="shest01" onclick="klik(); id="tovar0" /> Яблоки
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Виноград name="shest01" onclick="klik(); id="tovar1" /> Виноград
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Апельсины name="shest01" onclick="klik(); id="tovar2" /> Апельсины
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Мандарины name="shest01" onclick="klik(); id="tovar3" /> Мандарины
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Груши name="shest01" onclick="klik(); id="tovar4" /> Груши
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Сливы name="shest01" onclick="klik(); id="tovar5" /> Сливы
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Вишня name="shest01" onclick="klik(); id="tovar6" /> Вишня
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Черешня name="shest01" onclick="klik(); id="tovar7"" /> Черешня
</td>
</tr>
</table>
<input type="button" value=Вывести onclick="Sum();">
</div>
function klik() {
var c = [].filter.call(document.querySelectorAll('[name="shest01"]'), function (e) { return e.checked == true; });
c.forEach(function (eC) {
alert('чекбокс включён');
});
}
function Sum() {
confirm('не работает');
}
|
Annyshko,
кавычки!!!onclick="klik(); " id="tovar7" |
рони,
Цитата:
|
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div style="float: left; margin-right: 50px;" class="box4">
<p><b>Товары</b></p>
<table style="width: 270px; height: 350px; border: 1px solid gray;">
<tr>
<td>
<input type="checkbox" value=Яблоки name="shest01" onclick="klik();" id="tovar0" /> Яблоки
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Виноград name="shest01" onclick="klik();" id="tovar1" /> Виноград
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Апельсины name="shest01" onclick="klik();" id="tovar2" /> Апельсины
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Мандарины name="shest01" onclick="klik();" id="tovar3" /> Мандарины
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Груши name="shest01" onclick="klik();" id="tovar4" /> Груши
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Сливы name="shest01" onclick="klik();" id="tovar5" /> Сливы
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Вишня name="shest01" onclick="klik();" id="tovar6" /> Вишня
</td>
</tr>
<tr>
<td>
<input type="checkbox" value=Черешня name="shest01" onclick="klik();" id="tovar7" /> Черешня
</td>
</tr>
</table>
<input type="button" value=Вывести onclick="Sum();">
</div>
<script>
function klik() {
var c = [].filter.call(document.querySelectorAll('[name="shest01"]'), function (e) { return e.checked == true; });
c.forEach(function (eC) {
alert('чекбокс включён');
});
}
function Sum() {
confirm('не работает');
}
</script>
</body>
</html>
|
рони,
Мы выбираем нужные нам checkbox и потом по нажатию на кнопку открывается новая страница в которой показывается таблица только из выбранных ранее checkbox. Вот я не могу это реализовать, просто прописать переход на новую страницу по нажатию на кнопку, получается, в вывод таблицы из выбранных checkbox не получается. |
И не получится. Javascript имеет доступ только к текущему документу.
|
Erolast,
а как тогда поступить? |
Так, тебе надо, чтобы при переходе меж страницами с идентичными таблицами значение чекбоксов оставалось тем же, правильно? Записывай перед сменой страницы значения в куки (как - гугли"javascript cookie"), при загрузке второй страницы читай куки и скриптом выбирай соовтетствующие чекбоксы.
|
Цитата:
|
| Часовой пояс GMT +3, время: 20:15. |