javascript 选择 .change()
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8422538/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Select .change()
提问by Meisam Mulla
I have a few select boxes letting users input times that I pass on to the another page with:
我有几个选择框让用户输入我传递到另一个页面的时间：
<p class="apptmar">
<label for="from">Appointment Starts:</label><br />
<input type="text" name="from" id="from" class="appt" /><br />
<select name="fromh" class="apptselect">
<option>1</option>
...
<option>12</option>
</select>
<select name="fromm" class="apptselect">
<option>00</option>
<option>05</option>
...
<option>55</option>
</select>
<select name="froma" class="apptselect">
<option>AM</option>
<option>PM</option>
</select>
</p>
<p class="apptmar">
<label for="to">Appointment Ends:</label><br />
<input type="text" name="to" id="to" class="appt" /><br />
<select name="toh" class="apptselect">
<option>1</option>
...
<option>12</option>
</select>
<select name="tom" class="apptselect">
<option>00</option>
..
<option>55</option>
</select>
<select name="toa" class="apptselect">
<option>AM</option>
<option>PM</option>
</select>
</p>
What I want to do is that when a box under "Appointment From" is changed the value of the one under "Appointment To" to be changed to the same one. I have managed to accomplish this using the following:
我想要做的是，当“约会自”下的框更改时，“约会到”下的值更改为相同的值。我已设法使用以下方法完成此操作：
$('select[name="fromh"]').change( function() {
$('select[name="toh"]').val($(this).val());
});
This works as expected. What I want to do now is change the minutes but instead of it being changed to the same value I would like it to go to the next one. Ex. I Pick 05 under from, 10 under to will be selected. I tried using the following but it didnt work:
这按预期工作。我现在想要做的是更改分钟，但不是将其更改为相同的值，我希望它转到下一个。前任。I Pick 05 under from, 10 under to 将被选中。我尝试使用以下方法，但没有奏效：
$('select[name="fromm"]').change( function() {
$('select[name="tom"]').val($(this).val() + 1);
});
回答by Adam Rackis
I would use jQuery's filterfunction that has an overload which accepts a function.
我会使用 jQuery 的过滤器函数，它有一个接受函数的重载。
$('select[name="fromm"]').change( function() {
var $that = $(this);
var $targetNode = $('option', 'select[name="tom"]').filter(function() {
return $(this).text() === $that.val();
}).next();
$('select[name="tom"]').val($targetNode.text());
});
Or to be really safe:
或者要真正安全：
$('select[name="fromm"]').change( function() {
var $that = $(this);
var $targetNode = $('option', 'select[name="tom"]').filter(function() {
return $(this).text() === $that.val();
}).next();
if ($targetNode.length === 1)
$('select[name="tom"]').val($targetNode.text());
});
回答by Dennis
You can get the selected index in the current select, then get the next option's value. Roll over to zero if the user selected "55":
您可以获取当前 中选定的索引select，然后获取下一个选项的值。如果用户选择“55”，则翻转为零：
$('select[name="fromm"]').change(function() {
var index = (this.options.selectedIndex+1)%this.options.length;
$('select[name="tom"]').val(this.options[index].value);
});
JSFiddle: http://jsfiddle.net/eZBNG/1
JSFiddle：http: //jsfiddle.net/eZBNG/1
回答by Dale
I'm no expert, hardly know what I'm doing actually, but wouldn't this work too?
我不是专家，几乎不知道我在做什么，但这也行吗？
$('select[name="fromm"]').change( function() {
$('select[name="tom"]').val($(this).next().val());
});
Maybe need a little logic to see if there is a next?
也许需要一点逻辑来看看是否有下一个？
