Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   По кнопке поменять стиль границы ячейки не работает в Chrome (https://javascript.ru/forum/dom-window/28149-po-knopke-pomenyat-stil-granicy-yachejjki-ne-rabotaet-v-chrome.html)

guka 09.05.2012 14:24

По кнопке поменять стиль границы ячейки не работает в Chrome
 
Здравствуйте, подскажите, пожалуйста... В IE работает,в opera глючок, а в chrome не меняется стиль границы... Как мне исправить?
<html>
<script>
var fl1=true;
var fl2=true;
var fl3=true;
</script>
<body>
<div style="border: 2px solid blue; padding:10px;">
<font color=maroon>Разбери предложение по составу</font>
<br><br>
<table border=0><tr><td id=c1 name=c1 onClick="cel1();" style="cursor: pointer;">
<font size=6>&nbspМы&nbsp</font></td>
<td>&nbsp&nbsp</td>
<td id=c2 name=c2 onClick="cel2();" style="cursor: pointer;">
<font size=6>&nbspизучаем&nbsp</font></td>
<td>&nbsp&nbsp</td>
<td id=c3 name=c3 onClick="cel3();" style="cursor: pointer;">
<font size=6>&nbspинформатику.</font></td>
</tr>
<tr ><td colspan=5><br><font size=5 face="Monotype Corsiva" color="teal"><span id=c4

name=c4>&nbsp</span></font></td></tr></table>
<br><form><input type="button" value="Начать задание" onClick="nach();"

style="background-color: #d5ffd5; font: normal 20px Comic Sans MS;"></form></div>
<script>
function nach(){
document.getElementById('c2').style.borderBottomWi dth=0;
document.getElementById('c1').style.borderBottomWi dth=0;
document.getElementById('c3').style.borderBottomWi dth=0;
c4.innerHTML="Щелкни мышкой по подлежащему";
fl1=false;
};
function cel1() {
if (! fl1) {
document.getElementById('c1').style.borderBottomSt yle="solid";
document.getElementById('c1').style.borderBottomWi dth=5;
document.getElementById('c1').style.borderBottomCo lor="red";
c4.innerHTML="Щелкни мышкой по сказуемому";
fl2=false;
fl1=true;
}
else {
c4.innerHTML="Ошибочка вышла!"
};
};
function cel3() {
if (! fl3) {
document.getElementById('c3').style.borderBottomSt yle="dashed";
document.getElementById('c3').style.borderBottomWi dth=5;
document.getElementById('c3').style.borderBottomCo lor="navy";
c4.innerHTML="Ура! Молодец!";
}
else {
c4.innerHTML="Ошибочка вышла!"
};
};
function cel2() {
if (! fl2) {
document.getElementById('c2').style.borderBottomSt yle="double";
document.getElementById('c2').style.borderBottomWi dth=5;
document.getElementById('c2').style.borderBottomCo lor="lime";
c4.innerHTML="Щелкни мышкой по дополнению";
fl3=false;
fl2=true;
}
else {
c4.innerHTML="Ошибочка вышла!";
};
};
</script>
</body>
</html>
Как можно по-другому это записать? и я знаю, что у меня чуток в логике ошибки... переделаю... это кусок из мудла... там и не работает... т.е. не во всех браузерах работает

bes 09.05.2012 18:12

Заключите ваш код в bb-теги (например, js).

<style>
td {cursor: pointer; border: solid 1px red}
</style>

<table 
  onclick="
    e = event.srcElement || event.target; 
    e.style.border = 'dashed 5px green';
">
<tr>
  <td>ячейка 1
  <td>ячейка 2
</tr>
<tr>
  <td>ячейка 3
  <td>ячейка 4
</tr>
</table>


Часовой пояс GMT +3, время: 02:29.