|
Сообщение от aarka
|
|
Вот так бы хотелось, <div class="dvn" onClick="opendv('173')">Пробег от 90000 до 150 000</div>.
|
Как вариант...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
.dvv {
position: absolute;
left:0px;
top:31px;
padding:5px;
border: 1px solid #B5B8C8;
z-index:10;
background-color: #ffffff;
width:225px;
max-height:200px;
min-height:30px;
overflow-x:hidden;
overflow-y:auto ;
FONT: 12px 'Arial';
}
.dvn {
padding-left:5px;
padding-top:7px;
height:28px;
width:180px;
cursor:default;
FONT: 12px 'Arial';
}
.dvn {
border: 1px solid #B5B8C8;
margin-right:2px;
margin-bottom:2px;
width: 158px;
height: 28px;
overflow: hidden;
background: #ffffff url(select_arrow.png) 98% 6px no-repeat;
}
</style>
<script type='text/javascript'>
$(function() {
$(document).mouseup(function (e){ // событие клика по веб-документу
var div = $(".dvv"); // тут указываем ID или класс элемента
if (!div.is(e.target) // если клик был не по нашему блоку
&& div.has(e.target).length === 0) { // и не по его дочерним элементам
div.hide(); // скрываем его
actid = actid*(-1);
if(actid>0) actid=0;
};
});
$('.dvv > select').change(function(){
var id=$(this).data('target');
if (this.value=='0') {
var str='';
} else {
str=this.options[this.selectedIndex].innerHTML;
};
$('#'+id).text(str);
});
});
var actid = 0;
function opendv(a) {
if(document.getElementById('dvv'+a)){
actid = actid*(-1);
if(actid == a){
document.getElementById('dvv'+a).style.display = 'none';
actid = 0;
} else {
document.getElementById('dvv'+a).style.display = '';
$('#dvv'+a).scrollTop(0);
actid = a;
};
};
};
</script>
</head>
<body>
<div class="wrap">
<div class="blockselect" id="dvs173">
<div class="dvn" onClick="opendv('173')">Пробег <span id='beg'></span><span id='end'></span></div>
<div class="dvv" id="dvv173" style="display:none;">
<select name="f_chis_2[1]" data-target='beg'>
<option value="0" >Пробег от</option>
<option value="1000">от 1 000 </option>
<option value="5000">от 5 000 </option>
<option value="10000">от 10 000 </option>
<option value="15000">от 15 000 </option>
<option value="20000">от 20 000 </option>
<option value="25000">от 25 000 </option>
<option value="30000">от 30 000 </option>
<option value="35000">от 35 000 </option>
<option value="40000">от 40 000 </option>
</select>
<select name="f_chis_2[2]" data-target='end'>
<option value="0" >Пробег до</option>
<option value="1000">до 1 000 </option>
<option value="5000">до 5 000 </option>
<option value="10000">до 10 000 </option>
<option value="15000">до 15 000 </option>
<option value="20000">до 20 000 </option>
<option value="25000">до 25 000 </option>
<option value="30000">до 30 000 </option>
<option value="35000">до 35 000 </option>
<option value="40000">до 40 000 </option>
</select>
</div>
</div>
</div>
</body>
</html>