我正在尝试设置滑块值,但我无法管理它。我正在使用Capybara,selenium驱动程序。 html代码是:
<div class="pslide-container">
<div class="slider slider-horizontal" id="">
<div class="slider-track">
<div class="slider-selection" style="left: 0%; width: 100%;"></div>
<div class="slider-handle min-slider-handle triangle" tabindex="0" style="left: 0%;"></div>
<div class="slider-handle max-slider-handle triangle" tabindex="0" style="left: 100%;"></div>
</div>
<div class="tooltip tooltip-main top hide" style="left: 50%; margin-left: 0px;">
<div class="tooltip-arrow"></div>
<div class="tooltip-inner">9 : 693</div>
</div>
<div class="tooltip tooltip-min top hide" style="left: 0%; margin-left: 0px;">
<div class="tooltip-arrow"></div>
<div class="tooltip-inner">9</div>
</div>
<div class="tooltip tooltip-max hide top" style="top: -30px; left: 100%; margin-left: 0px;">
<div class="tooltip-arrow"></div>
<div class="tooltip-inner">693</div>
</div>
</div>
<input id="priceselect" type="text" class="span2 priceslider" value="9,693" data-slider-min="90" data-slider-max="693" data-slider-step="5" data-slider-value="[9,693]" data-slider-handle="triangle" data="value:'9,693'" style="display: none;">
<b class="pull-left">
<span id="minvalue">9</span> TL
</b>
<b class="pull-right">
<span id="maxvalue">693</span> TL
</b>
</div>
</div>
我尝试了.slider("values", 0, 80)
,但它不起作用:
$('#priceselect').slider("values", 0, 80)
Bootstrap滑块信息:
/* ========================================================= * bootstrap-slider.js * * Maintainers: * Kyle Kemp * - Twitter: @seiyria * - Github: seiyria * Rohit Kalkur * - Twitter: @Rovolutionary * - Github: rovolution * * =========================================================
答案 0 :(得分:2)
由于你正在使用seiyria的bootstrap-slider,你可以看到与jQuery一起使用的说明here
通过略读文档和示例,我认为以下内容应该是您想要的
$('#priceselect').slider('setValue', [0,80])
所以从Capybara做到这一点你会做
page.execute_script("$('#priceselect').slider('setValue', [0,80])")
如果要触发幻灯片和更改事件,可以将true传递给2个可选参数,所以
page.execute_script("$('#priceselect').slider('setValue', [0,80], true, true)")
将在设置新值时触发幻灯片和更改事件