Question

我想要一个listview，它在列表项的右侧对齐了一个flipswitch。这是我正在使用的代码：

<ul>
<li data-role="fieldcontain"><a href="#" onclick="openPlace();" >MyHyperlink</a><select name="slider" id="flip-a" data-role="slider"><option value="off">Off</option><option value="on" selected>On</option></select></li>
</ul>

这样可行，但在列表项中的swtch上方会有超链接。我尝试使用一个表，并努力使它们保持在同一条线上，但它破坏了jquery样式。如何在不弄乱样式的情况下实现这一目标？

Answer 1

为此，您必须在此处嵌入一些自定义CSS和一些额外的HTML ...

我创建了这个演示，希望这适合你，

<强> HTML： -

<ul data-role="listview" data-inset="true">
    <li>Acura
        <span class="fliper">
            <label for="flip2" class="ui-hidden-accessible">Flip switch:</label>
            <select name="flip2" id="flip2" data-role="slider">
                <option value="off">Off</option>
                <option value="on">On</option>
            </select>
        </span>
    </li>
    <li>Audi</li>
    <li>BMW</li>
    <li>Cadillac</li>
    <li>Ferrari</li>
</ul>

<强> CSS： -

.fliper { position:absolute; right:0; top:-4px; }

工作演示： - http://jsfiddle.net/H4UzV/

如何在jQuery mobile中的listview中使用内联元素

1 个答案: