选择最接近的无线输入

我有DOM类似如下选择最接近的无线输入

<input type="radio" name="day_time[]" class="pickup-location-day" value="Sunday"> Sunday 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:00am"> 02:00am 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:30am"> 02:30am 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="05:30am"> 05:30am<br> 

    <input type="radio" name="day_time[]" class="pickup-location-day" value="Sunday"> Monday 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:00am"> 02:00am 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:30am"> 02:30am 
<input type="radio" name="pickup_time[]" class="pickup-location-time" value="05:30am"> 05:30am<br> 

etc ....

我要绑定时选择.pickup-location-time与第一.pickup-location-day一样，当用户选择.pickup-location-time最近“.pickup地点天”应该也选中。我使用了以下

$('.pickup-location-time').on('change', function() { 
    $(this).closest('.pickup-location-time').prop('checked', true); 
})

但这不由

enter image description here

来源

2014-11-23 osos

看在jQuery的API在什么'最接近（）用于'的。会发现它不会做你想要的，除非你的收音机被包裹在组元素 – charlietfl 2014-11-23 13:59:14

使用prev()

$(this).prev('.pickup-location-day').prop('checked', true);

注意一定要选择.pickup-location-day。

来源

2014-11-23 13:58:33 beautifulcoder

你是对的，.closest()做了一些完全不同的事情。

如果您控制文档结构，为什么不使用$(this).next('.pickup-location-time')，因为它总是您想要选择的下一个元素？

来源

2014-11-23 13:58:51

将您的无线电收拾成组，以便可以在特定组内穿行。这简化了隔离情况下

<div class="radio-group"> 
    <input type="radio" name="day_time[]" class="pickup-location-day" value="Sunday">Sunday 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:00am">02:00am 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:30am">02:30am 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="05:30am">05:30am  
</div> 
<div class="radio-group"> 
    <input type="radio" name="day_time[]" class="pickup-location-day" value="Sunday">Monday 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:00am">02:00am 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="02:30am">02:30am 
    <input type="radio" name="pickup_time[]" class="pickup-location-time" value="05:30am">05:30am  
</div>

然后，你可以这样做：

$('.pickup-location-time').on('change', function() { 
    $(this).parent().find('.pickup-location-day').prop('checked', true); 
})

DEMO

来源

2014-11-23 14:08:15 charlietfl

这是个好主意，通过将它们包装在一个div中。但OP想要选择旁边的.pickup-location-time .. – 2014-11-23 14:10:04

@ Bhojendra-C-LinkNepal这是我解释OP所要求的。它正确地检查在适当的组内的'天' – charlietfl 2014-11-23 14:10:59

OP想要的时间不是天... – 2014-11-23 14:12:50

选择最接近的无线输入

回答

相关问题