document.body.style.backgroundColor onclick
почему в этом скрипте при третем нажатии на кнопку ничего не происходит (первые два нажатия работают норм):
function color() {
if (document.body.style.backgroundColor == '') return document.body.style.backgroundColor='#f00';
if (document.body.style.backgroundColor = '#f00') return document.body.style.backgroundColor='#0f0';
if (document.body.style.backgroundColor = '#0f0') return document.body.style.backgroundColor='#f00';
} ;
Кнопка: <input onclick="color();" value="Жми" type="button"> |
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
<body> <script> document.body.style.backgroundColor = '#f00'; // сконвертит его в rgb(255, 0, 0) alert( document.body.style.backgroundColor ); // увидим rgb(255, 0, 0) </script> </body>то есть я тестил в опере, в других браузерах может быть иначе. |
Цитата:
|
Можно текущую поллитру своять
<div style=position:absolute;z-index:-120;">
<span id=color1 style="background-color:#FF0000">a</span>
<span id=color2 style="background-color:#0000FF">a</span>
<span id=color3 style="background-color:#00FF00">a</span>
</div>
<script type="text/javascript">
var color=[];
color.push(document.getElementById('color1').style.backgroundColor)
color.push(document.getElementById('color2').style.backgroundColor)
color.push(document.getElementById('color3').style.backgroundColor)
</script>
|
Цитата:
И ведь первые 2нажатия на кнопку работают, а дальше нет |
можно просто использовать функцию конвертер, которая будет превращать всякие rgb значения в HEX:
<body>
<script type="text/javascript">
function toHexColor( color ) {
return color.replace( /rgba?\(([^\)]+)\)|#([a-f0-9]{6}|[a-f0-9]{3})/ig, function( m, rgb, hex ) {
if ( rgb = /([0-9\.]+)(\%?)\s*,\s*([0-9\.]+)(\%?)\s*,\s*([0-9\.]+)(\%?)\s*(?:,\s*([0-9\.]+))?/g.exec( rgb || "" ) ) {
hex = parseInt( rgb[2] ? rgb[1] * 2.55 : rgb[1] ).toString( 16 ).replace( /^(.)$/, '0$1' ) +
parseInt( rgb[4] ? rgb[3] * 2.55 : rgb[3] ).toString( 16 ).replace( /^(.)$/, '0$1' ) +
parseInt( rgb[6] ? rgb[5] * 2.55 : rgb[5] ).toString( 16 ).replace( /^(.)$/, '0$1' );
m = rgb[ 7 ] == "" || rgb[ 7 ] === undefined ? 1 : parseFloat( rgb[ 7 ] );
} else if ( hex && ( m = 1 ) ) {
hex = hex.replace( /^(.)(.)(.)$/, "$1$1$2$2$3$3" );
} else {
return m;
}
return "#" + hex;
});
}
document.body.style.backgroundColor = '#f00';
// сконвертит его в #ff0000
alert( toHexColor( document.body.style.backgroundColor ) ); // увидим #ff0000
</script>
</body>
простая ковертация цветов в шестизначный HEX |
Цитата:
|
Hekumok,
алерт всуньте в свою функцию - жмите кнопку и смотрите alert( document.body.style.backgroundColor ); |
<input onclick="color();" value="Жми" type="button">
<script type="text/javascript">
function toHexColor( color ) {
return color.replace( /rgba?\(([^\)]+)\)|#([a-f0-9]{6}|[a-f0-9]{3})/ig, function( m, rgb, hex ) {
if ( rgb = /([0-9\.]+)(\%?)\s*,\s*([0-9\.]+)(\%?)\s*,\s*([0-9\.]+)(\%?)\s*(?:,\s*([0-9\.]+))?/g.exec( rgb || "" ) ) {
hex = parseInt( rgb[2] ? rgb[1] * 2.55 : rgb[1] ).toString( 16 ).replace( /^(.)$/, '0$1' ) +
parseInt( rgb[4] ? rgb[3] * 2.55 : rgb[3] ).toString( 16 ).replace( /^(.)$/, '0$1' ) +
parseInt( rgb[6] ? rgb[5] * 2.55 : rgb[5] ).toString( 16 ).replace( /^(.)$/, '0$1' );
m = rgb[ 7 ] == "" || rgb[ 7 ] === undefined ? 1 : parseFloat( rgb[ 7 ] );
} else if ( hex && ( m = 1 ) ) {
hex = hex.replace( /^(.)(.)(.)$/, "$1$1$2$2$3$3" );
} else {
return m;
}
return "#" + hex;
});
}
function color() {
if ( toHexColor( document.body.style.backgroundColor ) == '')
return document.body.style.backgroundColor='#f00';
if ( toHexColor( document.body.style.backgroundColor ) == '#ff0000')
return document.body.style.backgroundColor='#0f0';
if ( toHexColor( document.body.style.backgroundColor ) == '#00ff00')
return document.body.style.backgroundColor='#f00';
}
</script>
|
devote,
Ну вон жа палитру текущих цветов браузера в его собственном формате - подставлять и сравнивать Свои цвета задаём в палитре - а считываем браузерные |
Deff,
можно но массив огромный получится, если в него впихнуть всю палитру. Хотя если тока нужные значения то да. Норм. |
devote,
Ти мож пихать динамически в один и тот жа span и считывать (*мну по быстрому - попонятней пытался |
Цитата:
|
Цитата:
<input onclick="color();" value="Жми" type="button">
<script type="text/javascript">
var toConvertedColor = (function( b ){
return function( color ) {
b.style.color = color;
return b.style.color;
}
})( document.createElement( 'b' ) );
function color() {
if ( document.body.style.backgroundColor == '')
return document.body.style.backgroundColor='#f00';
if ( document.body.style.backgroundColor == toConvertedColor( '#f00' ) )
return document.body.style.backgroundColor='#0f0';
if ( document.body.style.backgroundColor == toConvertedColor( '#0f0' ) )
return document.body.style.backgroundColor='#f00';
}
</script>
|
Цитата:
|
:blink: Почему -то все одно -синего нет ??? (Опера - ток -красный - и зелёный
|
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
Теперрь твои нужные цвета в текущем формате в массиве color -их подставляешь в cкрипте в цвета для боdy и их сравнивашь при считывании с бекграунда боdy |
Цитата:
|
Цитата:
Hekumok, этот метод devote,уже использует в последнем Скрипте и ужал его и укомпактил с 12 строк до 4 |
Цитата:
|
Цитата:
|
Цитата:
|
Я наверное дико поздно с ответом, просто сам искал ответ, разобрался в коде, вот так должен был выглядеть код, который работает:
function color() {
if (document.body.style.backgroundColor == ''){document.body.style.backgroundColor='red';}
else if (document.body.style.backgroundColor == 'red'){document.body.style.backgroundColor='green';}
else if (document.body.style.backgroundColor == 'green'){document.body.style.backgroundColor='blue';};
}
Косяк был в конструкции, человек забыл поставить фигурные скобки после if () {}; , из за этого функция завершала свою работу после первого выполненного, либо выполняла последнюю, так как все условия мгновенно выполнялись один за одним. Вот так она выглядит в цикле, то есть по кругу (R-G-B>R-G-B...):
function color() {
if (document.body.style.backgroundColor == ''){document.body.style.backgroundColor='red';}
else if (document.body.style.backgroundColor == 'red'){document.body.style.backgroundColor='green';}
else if (document.body.style.backgroundColor == 'green'){document.body.style.backgroundColor='blue';}
else {document.body.style.backgroundColor='red';};
}
|
Цитата:
|
Цитата:
|
И вообще, здесь в моменте на мой ответ среагировали, а когда создал тему с вопросом, так до сих пор и не получил ответа, уже сам нашёл, сам себе ответил под постом комментом, прикольно вы тут помогаете...
|
Цитата:
var n = 3;
if (n == 1) alert('Step 1');
else if (n == 2) alert('Step 2');
else if (n == 3) alert('Step 3');
else alert('Default step');
|
Цитата:
|
Хорошо, тогда без скобок перепиши тот код, и пусть он заработает, я проверял, у меня не работает без скобок, а со скобками работает, как ты это объяснишь? Или в это нужно верить, и тогда будет работать?
|
Цитата:
//здесь значение a будет присвоено по условию, а для b в любом случае
//то есть писать if(1) { a = 3; } нет никакой необходмости
if(1) a = 3;
b = 2;
//а чтобы при этом и b было присвоено значение также по этому условию,
//то только так и фигурные скобки тут необходимы
if(1) {
a = 3;
b = 2;
}
|
Цитата:
|
Но и указывать скобки тоже не запрещено, то есть ошибки от этого не будет. Тут кто какой философии придерживается, есть утверждающие, что без фигурных скобок код плохо читается, и т.п..
Отлично он читается, потому как мусора меньше. Но вот так форматировать код:
function text()
{document.getElementById("test").style.textAlign="left";}
это нечто. Я в теме где указан этот код даже сперва написал, что скобки лишние, ибо на автомате привык читать:
//либо так, что я предпочитаю
function name() {
//тело функции
}
//либо пишут так, что лично я не использую
function name()
{
//тело функции
}
хотя зрительно заметил, что что-то не то, и только спустя время из подсознания всплыло и я убрал комментарий по этому поводу. Так не стоит писать, это грабли способствующие появлению ошибок. |
Цитата:
|
Цитата:
|
| Часовой пояс GMT +3, время: 20:10. |