我有一个单选按钮,一个文本字段和一个选择字段。 这是html代码:
<div class="wb-success-delivery">
<input type="radio" name="delivery" value="0" /><span> Now)</span>
</div>
<div class="success-delivery">
<input type="radio" name="delivery" value="2" />
<input type="text" class="test" id="del_time_rang2" value="Tomorrow" name="delivery" />
<select id="del_time_rang" >
<option value="11-12pm">11-12pm</option>
<option value="12-1pm">12-1pm</option>
<option value="1-2pm">1-2pm</option>
</select>
</div>
然后我得到了一些带有更改功能的jQuery代码,用于存储上面用户选择的信息。
$j(document).ready(function(){
$j("input[name='delivery']").change(function(){
var $jtime= $j('#del_time_rang').val();
var $jdate= $j('#del_time_rang2').val();
var $jresult= $jdate + ' between ' + $jtime ;
if($j("input[name='delivery']:checked").val()==0) {
$j("#del_time_1").val('Now');
$j("#del_time_2").val('Now');
} else if($j("input[name='delivery']:checked").val()==2) {
$j("#del_time_1").val($jresult);
$j("#del_time_2").val($jresult);
}
});
});
现在这适用于#del_time_rang2
,但对于#del_time_rang
,仅当用户先选择正确的选项然后点击单选按钮时,它才有效。否则显示默认值(11-12pm)。
我认为这是因为更改事件是针对单选按钮输入,但不确定如何修复它?任何想法?
答案 0 :(得分:2)
我认为你应该将onChange
事件附加到select
,所以:
name="delivery"
添加到选择onChange
事件附加到$("[name='delivery']")
见以下内容:
$(document).ready(function(){
$("[name='delivery']").change(function(){
var $jtime= $('#del_time_rang').val();
var $jdate= $('#del_time_rang2').val();
var $jresult= $jdate + ' between ' + $jtime ;
if($("input[name='delivery']:checked").val()==0) {
$("#del_time_1").val('Now');
$("#del_time_2").val('Now');
} else if($("input[name='delivery']:checked").val()==2) {
$("#del_time_1").val($jresult);
$("#del_time_2").val($jresult);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wb-success-delivery">
<input type="radio" name="delivery" value="0" /><span> (Now)</span>
</div>
<div class="success-delivery">
<input type="radio" name="delivery" value="2" />
<input type="text" class="test" id="del_time_rang2" value="Tomorrow" name="delivery" />
<select id="del_time_rang" name="delivery" >
<option value="11-12pm">11-12pm</option>
<option value="12-1pm">12-1pm</option>
<option value="1-2pm">1-2pm</option>
</select>
</div>
<input type="text" id="del_time_1">
注意:无论如何,我认为selector
应该使用“class”属性而不是“name”属性。
我希望它可以帮助你,再见。