День добрый!
Есть php файл и обработчик.
Проблема с change, а конкретно в том, что обработчик на ура обрабатывает селекты, которые созданы в пхп файле, но
в упор не видит те селекты, которые я создаю
при помощи js
$('#subm1').before('<div id="level_4" class="level"><select id="rt1" class="divtype"><option value="1">Пункт1</option><option value="2">Пункт2</option><option value="3">Пункт3</option></select></div>');
(т.е он селект выводит, но change конкретно с этим элементом не пашет хотя по всем статьям должен пахать.
php код:
<!DOCTYPE html>
<head>
<title>autoshop</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<link rel='stylesheet' href='css/style.css' type='text/css' />
<script type='text/javascript' src='js/jquery-1.10.2.min.js'></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/jquery-ui.min.js"></script>
<script type='text/javascript' src='js/obrabotka.js'></script>
</head>
<body>
<div id="step2" >
<form method="POST" action="" id="sortContainer">
<div id="level_1" class="level">
<div id="main_set_1" class="main_set" >
<p>Ширина <input type="text" name="" id="reg_inp" /> Высота <input type="text" name="" id="reg_inp" /></p>
<div class="clear">
<div id="ll_1" class="ll">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
<div class="parametry">
<p>Парам <input type="text" name="" class="width_inp" />
<p>Парам <input type="text" name="" class="heigh_inp" />
<p>Парам <input type="text" name="" class="fon_inp" />
<p>Парам <input type="text" name="" class="padding_inp" />
</div>
</div>
<div id="cc_1" class="cc">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
</div>
<div id="rr_1" class="rr">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
</div>
</div>
<div class="clear"></div>
<a href="#" class="del" >Удалить</a>
</div>
<div id="level_2" class="level">
<div id="main_set_2" class="main_set" >
<p>Ширина <input type="text" name="" id="reg_inp" /> Высота <input type="text" name="" id="reg_inp" /></p>
</div>
<div class="clear">
<div id="ll_2" class="ll">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
</div>
<div id="cc_2" class="cc">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
</div>
<div id="rr_2" class="rr">
<select class="divtype">
<option value='1'>punkt1</option>
<option value='2'>punkt2</option>
<option value='3'>punkt3</option>
<option value='4'>punkt4</option>
</select>
</div>
</div>
<div class="clear"></div>
<a href="#" class="del">Удалить</a>
</div>
<input id="subm1" name="submits" type="submit" value="Отправить">
</form>
<div id="navi">
<p><a href="#" id="add">Добавить</a> </p>
<div id="step1" style="display: block;" >
<img src="img/1div.jpg" id="s1" class="s1" border="1"/>
<img src="img/2div.jpg" id="s2" class="s2" border="1"/>
<img src="img/3div.jpg" id="s3" class="s3" border="1"/>
</div>
</div>
</div>
</body>
</html>
обработчик:
$(document).ready(function() {
// alert('!');
$('img').click(function () { //клик по картинке
var currentClass = $(this).attr("class"); // заносим в переменную класс картинки
// alert(currentClass);
if (currentClass == "s1") {
$('#subm1').before('<div id="level_4" class="level"><select id="rt1" class="divtype"><option value="1">Пункт1</option><option value="2">Пункт2</option><option value="3">Пункт3</option></select></div>');
} else if (currentClass == "s2") {
alert("s2"+currentClass);
}
});
$(".divtype").change(function () { // отслежеваем изменения в выпадающем списке'
alert('сработало! 2');
var currentSelect = $(this).val(); // заносим в переменную новый выбор
if ($('.ll > select:focus').size() == 1) {
var ClassPozition = "_ll"; // помещаем в ClassPozition префикс который будет обозначать положение полей input
} else if ($('.cc > select:focus').size() == 1) {
var ClassPozition = "_cc";
} else if ($('.rr > select:focus').size() == 1) {
var ClassPozition = "_rr";
};
if (currentSelect == 1) {
$('select:focus + div').html(''); // удаляем прошлую активную форму
$('select:focus').after('<div class="parametry">Ширина <input type="text" name="size_width'+ClassPozition+'" id="reg_inp" /><br />Высота <input type="text" name="size_height'+ClassPozition+'" id="reg_inp" /></div>');
}
else if (currentSelect == 2) {
$('select:focus + div').html('');
$('select:focus').after('<div class="parametry">Ширина <input type="text" name="size_width'+ClassPozition+'" id="reg_inp" /><br />Высота <input type="text" name="size_height'+ClassPozition+'" id="reg_inp" /><br />Фон <input type="text" name="fon'+ClassPozition+'" id="reg_inp" /><br /></div>');
}
else if (currentSelect == 3) {
$('select:focus + div').html('');
$('select:focus').after('<div class="parametry">Ширина <input type="text" name="size_width'+ClassPozition+'" id="reg_inp" /><br />Высота <input type="text" name="size_height'+ClassPozition+'" id="reg_inp" /><br /> Фон <input type="text" name="fon'+ClassPozition+'" id="reg_inp" /><br /></div>');
}
});
}); // конец ready
