我有这个代码:
<section class="col col-md-4">
<label class="checkbox">
<input type="checkbox" name="subscription" class="chk_Especialization" value="1">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangestart start dateRange" id="start-1" placeholder="dtStart">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangefinish finish dateRange" id="finish-1" placeholder="dtEnd">
</label>
</section>
<section class="col col-md-4">
<label class="checkbox">
<input type="checkbox" name="subscription" class="chk_Especialization" value="2">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangestart start dateRange" id="start-2" placeholder="dtStart">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangefinish finish dateRange" id="finish-2" placeholder="dtEnd">
</label>
</section>
<section class="col col-md-4">
<label class="checkbox">
<input type="checkbox" name="subscription" class="chk_Especialization" value="3">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangestart start dateRange" id="start-3" placeholder="dtStart">
</label>
</section>
<section class="col col-md-4">
<label class="input">
<input type="text" class="dateRangefinish finish dateRange" id="finish-3" placeholder="dtEnd">
</label>
</section>
如果单击类开始输入元素,则需要下一个输入元素的警报ID;如果单击完成类元素,则需要上一个输入元素的警报ID。
我已经尝试使用这篇文章JQuery: Closest div that has an ID和这一个jquery, find next element by class,但我认为有一些错误,在我的代码。
这是JavaScript代码:
$(document).on("click", ".dateRange", function(){
if($(this).hasClass( "start" )){
//Select next input element with finish class
alert($(this).closest('input').next().attr("id"));
}
if($(this).hasClass( "finish" )){
//Select previous input element with start class
alert($(this).closest('input').prev().attr("id"));
}
});
我创建了一个jsfiddle:http://jsfiddle.net/towx8xro/1/
你知道出了什么问题吗?
3条答案
按热度按时间gajydyqb1#
问题似乎是你点击一个
input
,然后找到最近的input
,这不起作用。你需要沿着链向上走到section
,然后下一个或上一个,再回到它的输入:1qczuiv02#
您的选择器应该找到最接近的
section
元素,然后分别使用prev
和next
向前或向后查找相关的开始/结束输入。试试这个:Updated fiddle
e3bfsja23#
使用
.closest()
来确定点击的input
的父.col
,然后根据点击的输入start|finish
的类来确定direction
--next|prevv
。使用direction
选择目标.col
,使用.find
选择目标.col
中的input
元素,然后获取其id。