Question

我的输入范围的HTML代码如下所示：

<input class="sliderNoTextbox" id="ti_monatlich" type="range" name="ti_monatlich" data-theme="d">

它看起来像这样：

enter image description here

基于this answer我添加了以下css：

.sliderNoTextbox.ui-slider-input {
    display : none !important;
}

现在看起来像这样：

enter image description here

以前是文本框，现在是一个空格。我只是无法弄清楚如何摆脱那个空间..任何人都可以帮助我吗？

空白区域仅显示在Android设备上

更新

我创建了一个完全空的页面，只有滑块，仍然出现空白区域。它似乎不依赖于任何其他元素：

<body>
    <input class="sliderNoTextbox" id="ti_monatlich" type="range" name="ti_monatlich" data-theme="d">
</body>

将jQM 1.3.2与jQuery 1.8.3一起使用

Answer 1

Try this:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
<style>.ui-slider-input {
    display : none !important;
}
</style>
<div data-role="page">
    <div data-role="content">
        <label for="slider" class="ui-hidden-accessible">Input slider:</label>
        <input type="range" name="slider" id="@(Model.QuestionNo)_slider" value="25" min="0" max="100" />
    </div>
</div>

参考链接：http://jsfiddle.net/EWQ6n/2/

input = range remove textfield

1 个答案: