如何移动jQuery移动滑块控件'；什么是输入字段？

我试图将jQuery mobile滑块的输入字段移动到控件的右侧，而不是左侧（默认）。我还想在滑块控件的任一侧包括增加和减少按钮。所有这些都应该以内联方式显示，即在一个横跨显示器宽度的div中

我正在执行以下操作以分离和附加输入字段：

var inputField = $('input#slider-1').detach();
inputField.appendTo('#more');

但是滑块控件被挤压到无法使用的地步。完整代码或

---

如何在不使用固定像素值的情况下覆盖滑块的宽度？

将输入定位在右侧的要点是正确选择滑块

$('#control div.ui-slider').insertBefore('#slider-1');

要覆盖滑块的宽度，只需使用百分比值即可

#less { float:left; }
#control { float:left; width: 50%; }
#more { float:left; }

修改

此外，您还可以删除

#内部div

和

#test

。如果没有这些，它仍然可以工作。

检查此更新演示

我添加了脚本以根据增加/减少按钮移动滑块处理程序

$('#increase').live('tap',function(e){
    var slider = $("#slider-1");
    value = parseInt(slider.val(),10);            
    slider.val(value+1);
    slider.slider('refresh');
    slider.attr('style', 'left:'+(value+1)+'%;');
});

$('#decrease').live('tap',function(e){
    var slider = $("#slider-1");
    value = parseInt(slider.val(),10);
    slider.val(value-1);
    slider.slider('refresh');         
    slider.attr('style', 'left:'+(value-1)+'%;');
});

$('#control div.ui-slider').insertBefore('#slider-1');

---

谢谢您已经回答了主要问题，但没有通过增加/减少按钮真正解决问题。insertBefore（）看起来更干净！我看到了一个JQM页面，在那里这是一个可设置的选项，不久前，我现在正在寻找它。。。如果我找到了，我会发布。