div.click() и input
Подскажите как сделать
вот HTML <div class="size-box-item false-size">38<input type="number" class="hidden" value="0"></div> вот JS $(document).ready(function(){
$(".size-box-item.true-size").click(function(){
obj = $(this).children();
if (obj.get(0).value > 0) {
obj.get(0).value = 0;
obj.addClass("hidden");
}
else{
obj.get(0).value = 1;
obj.removeClass("hidden");
}
});
});
По нажатию на div в нем появляется input type="number", по еще нажатию исчезает. Проблема в том что при использовании input type=number срабатывает событие click, как сделать что бы при изменение значения input описанное выше событие не срабатывало. |
slavonbl,
Вариант ... $(document).ready(function(){
$(".size-box-item").click(function(){
obj = $(this).children();
if (obj.get(0).value > 0) {
obj.get(0).value = 0;
obj.addClass("hidden");
}
else{
obj.get(0).value = 1;
obj.removeClass("hidden");
}
});
$(".size-box-item input[type='number']").click(function(event){
event.stopPropagation();
})
});
|
расширю чуть ответ рони
stopPropagation() –Останавливает поток событий по дереву элементов, после того как сработали слушатели события для данного элемента Функции и свойства объекта Event ('Pro jQuery' на smarly.net) |
Точно.....!!! Спасибо...
|
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class="size-box-item false-size">38<input type="number" class="hidden" value="0"> Тут один клик по div или два</div>
<script>
$(document).ready(function(){
function Mytoggle(){
obj = $(".size-box-item").find("input");
var val =1*(Math.abs(obj.val())==0);
if(!val)obj.addClass("hidden");
if(val)obj.removeClass("hidden");
obj.val(val)
}
var timerId
$(".size-box-item").click(function(){
clearTimeout(timerId);//alert()
timerId=setTimeout(function (){Mytoggle()},100);
});
$(".size-box-item input").click(function(){
setTimeout(function (){clearTimeout(timerId)},20);
});
});
</script>
|
| Часовой пояс GMT +3, время: 13:04. |