0

jQuery モバイルデモ ページに示されている rangeslider ウィジェットの実装に問題があります。ただし、まったく同じコードをコピーすると、完璧に見えます。

<form>
<div data-role="rangeslider">
<label for="range-1a">Rangeslider:</label>
<input type="range" name="range-1a" id="range-1a" min="0" max="100" value="40">
<label for="range-1b">Rangeslider:</label>
<input type="range" name="range-1b" id="range-1b" min="0" max="100" value="80">
</div>
</form>

このjsFiddleに見られるように、入力ボックスは完全にずれています。

私は何を間違っていますか?デモ ページと同じスライダーを挿入するだけで、なぜこんなに難しいのでしょうか?

4

2 に答える 2

1

方法はわかりませんが、なんとなくコピー&ペーストに問題がある可能性があることを思い出しました。しかし、これを見つけるのは難しい場合があるため、他の人が調べられるように、ここで実際の解決策とともに質問を残します。

jQuery Mobile のデモ ページからコードをコピーすると、スペースに特殊な非表示文字が挿入され、この奇妙な動作が発生します。すべての空白が実際の空白であることを確認してください (たとえば、エディタで検索と置換を使用するか、自分でコードを記述します)。

したがって、奇妙な空白が含まれていないため、上からコードスニペットを使用すると実際に機能します。

于 2015-07-10T22:33:00.207 に答える