[英]jQuery: Effect on change with Amount-Slider
我有一个表单设置,当选择某些值时,我可以更改项目列表。
我有一个表格,其值是1到4年,选择这些选项时,结果字段中的值会随着调整的价格而变化。 使用此菜单时,一切正常。
现在,我已经安装了一个滑块( http://jqueryui.com/slider/#hotelrooms )并使其与菜单一起使用,但是jQuery的.change并没有接受该滑块对所做的更改。
正如您在这段脚本中所看到的:
<script>
$(function() {
var select = $( "#minbeds" );
var slider = $( "<div id='slider' style='margin-left:30px;'></div>" ).insertAfter( "#reserverer" ).slider({
min: 1,
max: 4,
range: "min",
value: select[ 0 ].selectedIndex + 1,
slide: function( event, ui ) {
select[ 0 ].selectedIndex = ui.value - 1;
}
});
$( "#minbeds" ).change(function() {
slider.slider( "value", this.selectedIndex + 1 );
});
});
</script>
它说的位: selectedIndex + 1,
更改菜单,但这不会激活以下jQuery代码:
<script>
$('#minbeds').change(function(){
if($(#minbeds).val() == '2 Years'){
$("#t_1_y_1").hide('slow');
$("#t_1_y_2").show('slow');
$("#t_1_y_3").hide('slow');
$("#t_1_y_4").hide('slow');
}
});
</script>
滑块正在运行,菜单正在运行,但是如何获取滑块以运行jQuery脚本?
在此先感谢您的帮助。
请尝试以下方法:
<script>
$(function() {
var select = $( "#minbeds" );
var slider = $( "<div id='slider' style='margin-left:30px;'></div>" ).insertAfter( "#reserverer" ).slider({
min: 1,
max: 4,
range: "min",
value: select[ 0 ].selectedIndex + 1,
slide: function( event, ui ) {
select[ 0 ].selectedIndex = ui.value - 1;
if(ui.value == '2') {
$("#t_1_y_1").hide('slow');
$("#t_1_y_2").show('slow');
$("#t_1_y_3").hide('slow');
$("#t_1_y_4").hide('slow');
}
}
});
$( "#minbeds" ).change(function() {
slider.slider( "value", this.selectedIndex + 1 );
if($(this).val() == '2'){
$("#t_1_y_1").hide('slow');
$("#t_1_y_2").show('slow');
$("#t_1_y_3").hide('slow');
$("#t_1_y_4").hide('slow');
}
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.