Javascript 基于选择选项更改jQuery UI滑块值

我正在尝试设置机票价格计算器，它根据所选位置显示每张机票的价格

票价计算器的值基于在选择表单中设置的值属性

我所有的代码都可以工作，除了$'region'。在'change'操作中。我根本无法将计算器中的数据更新为新值

小提琴：

$function{ //设置区域变量 开关$'region'.val{ 案例“10”： 风险价值成本=10， 时间=300； 打破 案例‘20’： 风险价值成本=20， 时间=600； 打破 } //滑块 $“滑块”。滑块{ 马克斯：时间， 敏：成本， 步骤：成本， 价值：成本， 幻灯片：functionevent，ui{ updatecost、time、ui.value； } }; //设置初始值 $'ticket'.html'1 ticket'； $'price'.html'$'+$'slider'.slider'value'； //区域变化 $'region'。在'change'上，函数{ 使现代化 }; }; 函数updatecost、时间、值{ $'ticket'.htmlvalue/cost+'ticket'； $'price'.html'$'+值； } 身体{ 文本对齐：居中； 保证金：50px自动； } 区域{ 显示：块； 利润率：10px自动； } 加利福尼亚州洛杉矶 纽约州纽约市

---

参数中没有数据，因为您只是不传递它们。只需将update更改为updatecost，time，$'slider'。slider'value'

您的代码有几个问题，直接的问题是更改侦听器中的更新调用没有传递正确的参数。将其从更新中更改；要更新cost、time、this.value，它应该可以工作

另外，假设预期行为是使用case/switch语句顶部计算的成本和时间值。在区域值更改中，您需要重新计算成本和时间变量。此外，您希望这会影响滑块中的回调。我会这样做，以确保一切正常，基本上，只需创建成本和时间全局变量，并在更新函数调用之前更新它们

var cost, time;

$(function() {
    // setting up region variables
    changeRegion($( '#region' ).val());

    // slider
    $( '#slider' ).slider({
        max: time,
        min: cost,
        step: cost,
        value: cost,
        slide: function( event, ui ) {
            update(ui.value);
        }
    });

    // set initial values
    $( '#ticket' ).html( '1 ticket' );
    $( '#price' ).html( '$' + $( '#slider' ).slider( 'value' ) );

    // region change
    $( '#region' ).on( 'change', function() {
        changeRegion(this.value);
        update(this.value);
    });

});

function changeRegion(value) {
  switch ( value ) {
      case '10':
          cost = 10, time = 300;
          break;
      case '20':
          cost = 20, time = 600;
          break;
  }
}

function update( value ) {
    $( '#ticket' ).html( ( value / cost ) + ' ticket' );
    $( '#price' ).html( '$' + value );
}

编辑：

此外，您还需要刷新滑块以更新时间和成本变量中反映的更改。例如，您需要调用类似以下内容，以便滑块反映这些更改：

sliderObject.slider("option", "min", cost);
sliderObject.slider("option", "step", cost);
sliderObject.slider("option", "max", time);
sliderObject.slider("value", cost);

---

您编写了：$'region'。在'change'上，函数{update；}；但是您的函数需要3个参数：函数更新成本、时间、值，它还保持滑块的位置。嘿，谢谢您的帮助！我更新了代码以反映这些更改，但它似乎仍然不起作用。我同意这是朝着正确方向迈出的一步。将开关移到change事件中，并在函数顶部声明变量；切换前，newValue*=切换后保持滑块位置的成本