如何使用jquery mobile在标签旁边添加一个文本框？

Question

如何使用jquery mobile在复选框旁边添加一个文本框？它应该在一行中（复选框 - ＆gt;标签（用于复选框） - ＆gt;文本框）

Answer 1

如果要在与其引用元素相同的行中添加标签，例如：

  

我的图例[]复选框标签

您可能想尝试使用data-role="fieldcontain"的字段容器。

例如：

<div data-role="fieldcontain">
    <fieldset data-role="controlgroup">
        <legend>Agree to the terms:</legend>
        <input type="checkbox" name="checkbox-2" id="checkbox-2" class="custom" />
        <label for="checkbox-2">I agree</label>
    </fieldset>
</div>

上面的代码会给你：

  

同意条款：[]我同意

查看在线文档以获取更多信息： http://jquerymobile.com/demos/1.1.1/docs/forms/checkboxes/

---

现在，如果你想要一行上的几个元素（=不同列中的几个元素），我的意思不仅仅是标签及其元素，你可能想检查jQuery Mobile的Layout grids：{{3 }}

---

考虑到您的示例案例，我想您可能想尝试使用上述两种方法的组合。所以，你可以尝试这样的事情：

<div class="ui-grid-a">

    <!-- FIRST COLUMN -->
    <div class="ui-block-a">
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <legend>Agree to the terms:</legend>
                <input type="checkbox" name="checkbox-2" id="checkbox-2" class="custom" />
                <label for="checkbox-2">I agree</label>
            </fieldset>
        </div>
    </div>

    <!-- SECOND COLUMN -->
    <div class="ui-block-b">
        <input type="text"/>
    </div>

</div>

希望这有帮助。