ios - 如何更改 JQM 中 slider 的文本标签?

标签 ios html jquery-mobile slider jquery-ui-slider

我正在使用 Jquerymobile。我有一个 slider 和一个与之对应的文本框。当我们按照我们定义的范围移动 slider 时,默认功能的给定值会显示在文本字段中。但我想显示文本而不是数字。这更像是严重性问题。 即:当 slider 值达到 30 时,文本框中应显示“less sever”,当 slider 值达到 50 时,文本应更改为“more sever”。

最佳答案

@Jeemusu 的解决方案在所有情况下都不适合我...... 因此我使用 this info 修改了它:

<script>
$(document).bind('pageinit', function () {
  //depending on the device we have a touch or a mouse event
  var supportTouch = jQuery.support.touch,
      touchStartEvent = supportTouch ? "touchstart" : "mousedown",
      touchStopEvent  = supportTouch ? "touchend"   : "mouseup",
      touchMoveEvent  = supportTouch ? "touchmove"  : "mousemove";

  //the event is bound to the .ui-slider inside of the input type range
  $('#slider-a').siblings('.ui-slider').bind(touchStopEvent,function(){
    var sliderVal = $("#slider-a").attr('value');

    if(sliderVal <= 30) {
      $('#slider-phrase').html('normal');
    } else if(sliderVal >= 30 && sliderVal < 50) {
      $('#slider-phrase').html('less severe');
    } else if(sliderVal >= 50) {
      $('#slider-phrase').html('more severe');
    }
  });
});
</script>

参见working example here

关于ios - 如何更改 JQM 中 slider 的文本标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13467335/

相关文章:

ios - 内购完成后如何隐藏按钮

javascript - Html 页面中的实时搜索

jQuery dataTables 标题最初不调整为列值,而是在拖动屏幕后调整

jquery - 带有正确文本的拆分按钮 ListView

ios - 单元格背景 View 未填充整个单元格

iphone - 保存后 UITableViewCell 和 Coredata 上的 UIImage 的方向发生变化

ios - UIView阴影渐变

html - Angular 2 : restart the html audio tag on real time

javascript - angularjs 在应用程序初始化后注入(inject)模块

javascript - Phonegap - iOS 文件传输不适用于授权 header