Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Cannot read property 'style' of null (https://javascript.ru/forum/events/34592-cannot-read-property-%27style%27-null.html)

megafomka 11.01.2013 11:57
Cannot read property 'style' of null
 
Нужно поменять фон элемента, по условию.
JS не может подцепить элемент по ID -(
Не понимаю что такое, уже явно пробовал объявить элемент перед кодом, все равно та же фигня

Код:
<style type="text/css">
#phonered {};
</style>
 <?
if($_POST["send-request"]){
//  $email = "disco3000@gmail.com";
//  $email = "info@eurasiataxi.ru";
$email = "pklimovp@gmail.com";
  $phoneReg = '/^\(\d{3}\)\d{3}-\d{2}-\d{2}$/';
  if(!preg_match($phoneReg, $_POST["phone"])){?>
<p><b>Укажите, пожалуйста, телефон!</b></p>
 
<script type='text/javascript'>
var phoneobj = document.getElementById('phonered')
    phoneobj.style.background='red';
    </script>
 <?}

Deff 11.01.2013 12:14
Выложите код готового HTML (без PHP), возможно не так сгенирована
Используйте кнопку <> для обрамления кода

megafomka 11.01.2013 12:23 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="robots" content="noindex, nofollow" />
<meta name="keywords" content="1С-Битрикс, CMS, PHP, bitrix, система управления контентом" />
<meta name="description" content="1С-Битрикс: Управление сайтом" />
<link href="/bitrix/js/main/core/css/core.css?1350575852" type="text/css" rel="stylesheet" />
<link href="/bitrix/templates/.default/components/bitrix/menu/top-menu/style.css?1350575852" type="text/css" rel="stylesheet" />
<link href="/bitrix/templates/.default/components/bitrix/catalog.section/top-banners/style.css?1350575852" type="text/css" rel="stylesheet" />
<link href="/bitrix/templates/.default/components/bitrix/catalog.section/right-blocks/style.css?1350575852" type="text/css" rel="stylesheet" />
<link href="/bitrix/templates/eurasia.taxi/styles.css?1353314003" type="text/css" rel="stylesheet" />
<link href="/bitrix/templates/eurasia.taxi/template_styles.css?1353314003" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="/bitrix/js/main/core/core.js?1350575852"></script>
<script type="text/javascript">BX.message({'LANGUAGE_ID':'ru','FORMAT_DATE':'DD.MM.YYYY','FORMAT_DATETIME':'DD.MM.YYYY HH:MI:SS','COOKIE_PREFIX':'BITRIX_SM','USER_ID':'','SERVER_TIME':'1357892412','SERVER_TZ_OFFSET':'14400','USER_TZ_OFFSET':'0','bitrix_sessid':'d1689cd894b43a69bfed2d0bbeccfc28','SITE_ID':'s1','JS_CORE_LOADING':'Загрузка...','JS_CORE_WINDOW_CLOSE':'Закрыть','JS_CORE_WINDOW_EXPAND':'Развернуть','JS_CORE_WINDOW_NARROW':'Свернуть в окно','JS_CORE_WINDOW_SAVE':'Сохранить','JS_CORE_WINDOW_CANCEL':'Отменить','JS_CORE_H':'ч','JS_CORE_M':'м','JS_CORE_S':'с'})</script>
<script type="text/javascript" src="/bitrix/js/main/core/core_ajax.js?1350575852"></script>
<script type="text/javascript" src="/bitrix/js/main/session.js?1350575852"></script>
<script type="text/javascript">
bxSession.Expand(86400, 'd1689cd894b43a69bfed2d0bbeccfc28', false, '278af244611463f4e3f47cc6299afc98');
</script>
<title> Евразия Такси</title>
<link href="/js/datepicker/jquery.datepick.css" rel="stylesheet" type="text/css" />
<link href="/style/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="/js/jquery.color.js"></script>
<script type="text/javascript" src="/js/select.js"></script>
<script type="text/javascript" src="/js/hover.js"></script>
<script type="text/javascript" src="/js/datepicker/jquery.datepick.min.js"></script>
<script type="text/javascript" src="/js/datepicker/jquery.datepick-ru.js"></script>
<script type="text/javascript" src="/js/jquery.carouFredSel-6.0.4-packed.js"></script>
<script type="text/javascript" src="/js/jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="/js/scripts.js"></script>
<link rel="shortcut icon" href="/favicon.ico" />

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-35526096-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'stats.g.doubleclick.net/dc.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

</head>

<body>

<div id="panel"></div>
<div class="bg_t">
<div class="bg_b">
	<div class="container">
		<div class="lCol">
			<div class="block1">
				<div class="bg_t">
					<div class="logoBlock">
						<a href="/" title="Eurasia Taxi"><span class="logo"></span></a>
					</div>
					<div class="phone">
						<img src="/images/phone.png" alt="+7 (495) 647-11-11" title="+7 (495) 647-11-11" />
					</div>
					<div class="btnOrder">
						<a href="/order/" title="Заказать такси on-line"></a>
					</div>
					<div class="contacts">
					</div>
				</div>
			</div>
			<div class="block2">
				<div class="block">
					<h1><a href="/services-and-prices/" title="Услуги и тарифы">Услуги и тарифы</a></h1>
                                             					<h2><a href="/additional-services/" title="Дополнительные услуги">Дополнительные услуги</a></h2>
				</div>
				<div class="bg_b"></div>
			</div>
		</div>
		<div class="rCol">
			<div class="head">
				<div class="tBlock">
					<div class="menu">
					</div>
					<div class="lang">
<!--						<span class="ru"></span> <a href="#" title="#" class="en"></a>-->					
					</div>
					<div class="Clear"></div>
				</div>
				<div class="bannerBlock">
					<ul id="bannerList">
										<li id="bx_2647885750_15">
							<img src="/upload/iblock/3e7/ban3.jpg" alt="Более 100 автомобилей бизнес класса 2012 года выпуска" title="Более 100 автомобилей бизнес класса 2012 года выпуска" />
							<div class="txt">
								<h1>Более 100 автомобилей бизнес класса 2012 года выпуска</h1>
								<h2><a href="/fleet/" title="Подробнее">Подробнее</a></h2>
							</div>
						</li>
										<li id="bx_2647885750_4">
							<img src="/upload/iblock/7a7/ban5.jpg" alt="Сертифицированные операторы call-центра со знанием английского языка" title="Сертифицированные операторы call-центра со знанием английского языка" />
							<div class="txt">
								<h1>Сертифицированные операторы call-центра со знанием английского языка</h1>
								<h2><a href="/education-center/" title="Подробнее">Подробнее</a></h2>
							</div>
						</li>
										<li id="bx_2647885750_3">
							<img src="/upload/iblock/a17/banner.jpg" alt="Кожаный салон, планшетный компьютер и интернет в длительных поездках" title="Кожаный салон, планшетный компьютер и интернет в длительных поездках" />
							<div class="txt">
								<h1>Кожаный салон, планшетный компьютер и интернет в длительных поездках</h1>
								<h2><a href="/advantages/" title="Подробнее">Подробнее</a></h2>
							</div>
						</li>
										<li id="bx_2647885750_16">
							<img src="/upload/iblock/8c2/czb26i1o-копия2.jpg" alt="Гибкая бонусная система" title="Гибкая бонусная система" />
							<div class="txt">
								<h1>Гибкая бонусная система</h1>
								<h2><a href="/bonuses-and-discounts/" title="Подробнее">Подробнее</a></h2>
							</div>
						</li>
										<li id="bx_2647885750_14">
							<img src="/upload/iblock/1ad/ban4.jpg" alt="Профессиональные водители со знанием правил делового этикета" title="Профессиональные водители со знанием правил делового этикета" />
							<div class="txt">
								<h1>Профессиональные водители со знанием правил делового этикета</h1>
								<h2><a href="/education-center/" title="Подробнее">Подробнее</a></h2>
							</div>
						</li>
							</ul>
					<div class="pager" id="pager">
					</div>
				</div>
			</div>
			<div class="center">
				<div class="lBlock">

        					<div class="mainPage">
						<h1> Евразия Такси</h1> 
<style type="text/css">
#phonered {};
</style>
  
<p><b>Укажите, пожалуйста, телефон!</b></p>
 
<script type='text/javascript'>
var phoneobj = document.getElementById('phonered')
    phoneobj.style.background='red';
    </script>
   						 
<p>Если Вы не хотите заполнять все поля формы, оставьте только свой телефон, и наш оператор перезвонит Вам сам в кратчайшее время!</p>
 					 					 
<div class="order"> 						 </div>
 
<p>Если Вы не хотите заполнять все поля формы, оставьте только свой телефон, и наш оператор перезвонит Вам сам в кратчайшее время!</p>
 					 					 
<div class="order"> <form method="POST"> 						<input type="hidden" name="car-type" value="Любой" /> 	 				<input type="hidden" name="key" value="80045A090BF84481846214CB2407E17F" /> 
    <div class="item"> 							 
      <p>Ваш телефон<font color="#ff0000">*</font></p>
     							<div id="phonered"><span class="textfield"><input type="text" name="phone" id="form-phone" value="" />&nbsp;</span></div>						</div>
   						 
    <div class="item"> 							 
      <p>Ваше имя</p>
     							<span class="textfield"><input type="text" name="name" value="" /></span> 						</div>
   						 
    <br />
  ......................................

Deff 11.01.2013 12:29
Скрипт стоит до элемента
144 <script type='text/javascript'>
145 var phoneobj = document.getElementById('phonered')
146 phoneobj.style.background='red';
147 </script>
148
149 <p>Если Вы не хотите заполнять все поля формы, оставьте только свой телефон, и наш оператор перезвонит Вам сам в кратчайшее время!</p>
150
151 <div class="order"> </div>
152
153 <p>Если Вы не хотите заполнять все поля формы, оставьте только свой телефон, и наш оператор перезвонит Вам сам в кратчайшее время!</p>
154
155 <div class="order"> <form method="POST"> <input type="hidden" name="car-type" value="Любой" /> <input type="hidden" name="key" value="80045A090BF84481846214CB2407E17F" />
156 <div class="item">
157 <p>Ваш телефон<font color="#ff0000">*</font></p>
158 <div id="phonered"><span class="textfield"><input type="text" name="phone" id="form-phone" value="" />&nbsp;</span></div> </div>
159
160 <div class="item">

Либо ставьте после, либо обернуть в событие window.onload = function() {
.........тут код.....
}

megafomka 11.01.2013 12:32
Если я код JS вставляю прям после самого 
<div id="phonered"><span class="textfield"><input type="text" name="phone" id="form-phone" value="" />&nbsp;</span></div>


То он работает

Но мне нужно что-бы проверка происходило только после нажатия на кнопку

Deff 11.01.2013 12:34
Цитата:
Сообщение от megafomka
То он работает

Но мне нужно что-бы проверка происходило только после нажатия на кнопку
Укажите cелектор кнопки - желательно ID ?

megafomka 11.01.2013 12:36 
<input type="submit" name="send-request" class="btn" value=" " />

Deff 11.01.2013 12:50 
<input type="submit" omsubmit="document.getElementById('phonered').style.background='red';" name="send-request" class="btn" value=" " />

Или
<script type='text/javascript'>
var phoneobj;
function setStyle(){
  phoneobj = document.getElementById('phonered')
  phoneobj.style.background='red';
}
</script>


<input type="submit" omsubmit="setStyle()" name="send-request" class="btn" value=" " />

megafomka 11.01.2013 15:32
У меня проверка идет в PHP, мне нужно как-то от туда вызывать JS, Или делать проверку PHP в коде JS...

Как лучше сделать даже не знаю, сейчас попробую что-нибудь

megafomka 11.01.2013 17:53
Что-то не могу собразить -(

Вопрос в следующем сейчас стоит

Есть PHP проверка

Код:
<?
if($_POST["send-request"]){
$phoneReg = '/^\(\d{3}\)\d{3}-\d{2}-\d{2}$/';
  if(!preg_match($phoneReg, $_POST["phone"])){
    echo "<p><b>Укажите, пожалуйста, телефон!</b></p>";
Как мне добавить к сообщению действия:
- Смена фона поля
- Установка фокуса на поле

Js по установке фокуса и смене фона я написал, как её впихнуть в условие правильно не пойму 

<script type='text/javascript'>
function checkphone(){
    document.getElementById('phonered').style.background='red';  
    document.getElementById('form-phone').focus();
    window.scrollTo(0, 0);
}
</script>


Часовой пояс GMT +3, время: 22:22.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице