Матрица радиокнопок
Добрый день. Скажите пожалуйста, как можно осуществить такую идею. Есть матрица радиокнопок 5х5. Как сделать, чтобы при нажатии на любую из них в ее столбце и в ее строке остальные кнопки стали не доступны. В итоге должно быть, чтобы можно было выбрать всего 5 кнопок и на одной строке и столбце лежала только одна. Очень нуждаюсь в помощи. Спасибо.
|
Вам как, подсказать чего? Или сразу решение написать? На работу за вас не пойти? Денег за вас не получить?
Конкретнее задавайте вопрос! |
Цитата:
А про конкретно вопрос. Вот что есть:
<tr>
<td>
<input type="radio" name="line1" value="1">
<input type="radio" name="line1" value="2">
<input type="radio" name="line1" value="3">
<input type="radio" name="line1" value="4">
<input type="radio" name="line1" value="5">
</td>
</tr>
<tr>
<td>
<input type="radio" name="line2" value="1">
<input type="radio" name="line2" value="2">
<input type="radio" name="line2" value="3">
<input type="radio" name="line2" value="4">
<input type="radio" name="line2" value="5">
</td>
</tr>
<tr>
<td>
<input type="radio" name="line3" value="1">
<input type="radio" name="line3" value="2">
<input type="radio" name="line3" value="3">
<input type="radio" name="line3" value="4">
<input type="radio" name="line3" value="5">
</td>
</tr>
<tr>
<td>
<input type="radio" name="line4" value="1">
<input type="radio" name="line4" value="2">
<input type="radio" name="line4" value="3">
<input type="radio" name="line4" value="4">
<input type="radio" name="line4" value="5">
</td>
</tr>
<tr>
<td>
<input type="radio" name="line5" value="1">
<input type="radio" name="line5" value="2">
<input type="radio" name="line5" value="3">
<input type="radio" name="line5" value="4">
<input type="radio" name="line5" value="5">
</td>
</tr>
Сейчас можно в каждой линии выбрать только одну кнопку, но в каждой линии можно выбрать например цифру 5 (а точнее кнопку со значением 5). Получится в итоге пять цифр 5. А нужно чтобы каждую цифру можно было выбрать однажды причем только одну в строке. Я так понимаю, что каждой кнопке надо дать id и написать функцию типа если нажата кнопка то такие id которые стоят с ней в одной линии по вертикали и по горизонтали должны стать disabled. Вот. Но от яваскрипта далековат я. Поэтому прошу помочь с идеей, правильно ли я думаю и как правильно реализовать функцию. |
fredrsf,
А вы думаете приятно когда, кто-нибудь за просто так хочет воспользоваться вашими знаниями и тем что вы не один год нарабатывали и изучали? В общем не суть. Я немного не понял, саму задачу? Нужно что бы при выборе какого-то радио остальные по горизонтали и вертикали отключались на совсем? или просто меняли значение, на не выбранные? |
Цитата:
и чтобы можно было снимать с радио отметку но не суть. fredrsf, вам все верно сказали. Вы просите готовый скрипт с нуля. Это работа, и за нее обычно платят деньги. Для таких сообщений предназначен раздел форума "Работа". Если вы все же хотите, чтобы вам помогли - приложите какие-то усилия сами и задавайте вопросы по ходу дела. |
Цитата:
|
Цитата:
|
fredrsf,
В таблице это проще реализовать. |
Самое простое что пришло на ум, это указать индексы для каждого элемента, по типу того как нумеруются элементы массива, а дальше уж совсем просто.
|
Цитата:
|
fredrsf,
Похоже на задачу как расставить ладьи на шахматной доске, чтобы они не били друг друга? )))
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
td{
height: 22px; width: 22px; text-align: center;
}
</style>
</head>
<body>
<script language="JavaScript" type="text/javascript">
for (var m = [], l = 10, b = ["background-color: #FFFF00;", "background-color: #00FF00;", "background-color: #FF0000;"],
t = document.createElement("table"), c = 0; c < l; c++) {
var tr = t.insertRow(c);
m[c] = c;
for (var s = 0; s < l; s++) tr.insertCell(s).style.cssText = b[0]
}
document.body.appendChild(t);
c = 0;
function go() {
for (s = 0; s < l; s++) t.rows[c].cells[s].style.cssText = b[1];
r = Math.floor(Math.random() * m.length);
r = m.splice(r, 1);
t.rows[c].cells[r].style.cssText = b[2];
for (s = ++c; s < l; s++) t.rows[s].cells[r].style.cssText = b[1];
c < l && setTimeout(arguments.callee, 600)
};
</script>
<input type="button" name="" value="go" onclick="go()"/>
</body>
</html>
|
рони,
на сколько я помню там ферзи, а не ладьи ) когдато не верил что она решаема ) |
fredrsf,
<table>
<tr>
<td>
<input type="checkbox" name="line1" value="1">
<input type="checkbox" name="line1" value="2">
<input type="checkbox" name="line1" value="3">
<input type="checkbox" name="line1" value="4">
<input type="checkbox" name="line1" value="5">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="line2" value="1">
<input type="checkbox" name="line2" value="2">
<input type="checkbox" name="line2" value="3">
<input type="checkbox" name="line2" value="4">
<input type="checkbox" name="line2" value="5">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="line3" value="1">
<input type="checkbox" name="line3" value="2">
<input type="checkbox" name="line3" value="3">
<input type="checkbox" name="line3" value="4">
<input type="checkbox" name="line3" value="5">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="line4" value="1">
<input type="checkbox" name="line4" value="2">
<input type="checkbox" name="line4" value="3">
<input type="checkbox" name="line4" value="4">
<input type="checkbox" name="line4" value="5">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="line5" value="1">
<input type="checkbox" name="line5" value="2">
<input type="checkbox" name="line5" value="3">
<input type="checkbox" name="line5" value="4">
<input type="checkbox" name="line5" value="5">
</td>
</tr>
</table>
<script>
var checkboxes = (document.getElementsByTagName('input'));
for(var i=0;i<checkboxes.length;i++){
checkboxes[i].onclick = function (){
var checkboxes = (document.getElementsByTagName('input'));
for(var i=0;i<checkboxes.length;i++){
if((this.name!=checkboxes[i].name || this.value!=checkboxes[i].value) && (this.name==checkboxes[i].name || this.value==checkboxes[i].value)){
checkboxes[i].disabled = !!this.checked;
}
}
}
}
</script>
так надо ? |
DooMer,
Простая растановка ферзей на поле любой величины ))) Давненько не брал я в руки шашек.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
td{
height: 22px; width: 22px; text-align: center;
}
</style>
</head>
<body>
<script language="JavaScript" type="text/javascript">
for (var m = [], l = 8, b = ["background-color: #FFFF00;", "background-color: #00FF00;", "background-color: #FF0000;"],
t = document.createElement("table"), c = 0; c < l; c++)
{
var tr = t.insertRow(c);
m[c] = [];
for (var s = 0; s < l; s++) {
tr.insertCell(s).style.cssText = b[0];
m[c][s] = s
}
}
document.body.appendChild(t);
c = 0;
function go() {
f = [];
for (s = 0; s < l; s++) if (m[c][s] >= 0) {
t.rows[c].cells[s].style.cssText = b[1];
f.unshift(m[c][s])
}
c++;
if (f.length) {
r = Math.floor(Math.random() * f.length);
r = f.splice(r, 1)[0];
t.rows[c - 1].cells[r].style.cssText = b[2];
m[c - 1][r] = -1;
s = c;
for (a = 0; s < l; s++) {
t.rows[s].cells[r].style.cssText = b[1];
m[s][r] = -1;
a++;
if (r - a >= 0) {
t.rows[s].cells[r - a].style.cssText = b[1];
m[s][r - a] = -1
}
if (r + a < l) {
t.rows[s].cells[r + a].style.cssText = b[1];
m[s][r + a] = -1
}
}
}
c < l && setTimeout(arguments.callee, 600)
};
</script>
<input type="button" name="" value="go" onclick="go()"/>
</body>
</html>
|
| Часовой пояс GMT +3, время: 20:27. |