Question

所以我在这里遇到了一个令人困惑的问题。我正在用HTML和JQuery Mobile创建一个表。然而，它的元素保持重叠，并且内容没有应用UI CSS。我是否遗漏了一些明显的东西，或者我对JQuery Mobile Library有什么不熟悉的东西？

<table><tr><td><input type="radio"/></td><td>Less than $25,000</td></tr>
    <tr><td><input type="radio"></td><td>$25,000 - $49,999</td></tr>
    <tr><td><input type="radio"></td><td>$50,000 - $74,999</td></tr>
    <tr><td><input type="radio"></td><td>$75,000 - $100,000</td></tr>
    <tr><td><input type="radio"></td><td>More than $100,000</td></tr>
    <tr><td><input type="radio"></td><td>I am not required to share this information</td></tr>
</table></form>

Here is the code and image of what's going on.

Answer 1

首先发出：

无线电选项需要使用此标记才能正确显示jQM

http://jquerymobile.com/demos/1.2.0/docs/forms/radiobuttons/

HTML

<fieldset data-role="controlgroup" data-mini="true">
        <input type="radio" name="radio-mini" id="radio-mini-1" value="choice-1" checked="checked" />
        <label for="radio-mini-1">Credit</label>

    <input type="radio" name="radio-mini" id="radio-mini-2" value="choice-2"  />
        <label for="radio-mini-2">Debit</label>

        <input type="radio" name="radio-mini" id="radio-mini-3" value="choice-3"  />
        <label for="radio-mini-3">Cash</label>
</fieldset>

现在（我认为）您正在使用表格标签来布局或显示屏幕上的元素。我建议不要这样做，因为它用于指法数据。我想这就是你要找的东西：

http://jsfiddle.net/Lctam/1/

HTML

<div data-role="page" class="type-home">

   <div data-role="content">
      <fieldset data-role="controlgroup">
    <legend>Annual Salary:</legend>
         <input type="radio" name="radio-choice" id="radio-choice-1" value="choice-1" checked="checked" />
         <label for="radio-choice-1">Less tahn $24,999</label>

         <input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2"  />
         <label for="radio-choice-2">$25,000 - $49,999</label>

         <input type="radio" name="radio-choice" id="radio-choice-3" value="choice-3"  />
         <label for="radio-choice-3">$50,000 - $74,999</label>

         <input type="radio" name="radio-choice" id="radio-choice-4" value="choice-4"  />
         <label for="radio-choice-4">$75,000 - $99,999</label>

          <input type="radio" name="radio-choice" id="radio-choice-5" value="choice-5"  />
         <label for="radio-choice-5">More than $100,000</label>

          <input type="radio" name="radio-choice" id="radio-choice-6" value="choice-6"  />
         <label for="radio-choice-6">I am not required to share this information
</label>
</fieldset>
   </div>
</div>

而且，在jQM中，表格的记录还不是很好，但你可以发现显示需要一些额外的属性。

http://jquerymobile.com/demos/1.2.0/docs/content/content-html.html

（在Chrome中查看）

view-source：http：//jquerymobile.com/demos/1.2.0/docs/content/content-html.html

HTML：

<table summary="This table lists all the JetBlue flights.">
    <caption>Travel Itinerary</caption>
    <thead>
        <tr>
            <th scope="col">Flight:</th>
            <th scope="col">From:</th>
            <th scope="col">To:</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <td colspan="5">Total: 3 flights</td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <th scope="row">JetBlue 983</th>
            <td>Boston (BOS)</td>
            <td>New York (JFK)</td>
        </tr>
        <tr>
            <th scope="row">JetBlue 354</th>
            <td>San Francisco (SFO)</td>
            <td>Los Angeles (LAX)</td>
        </tr>
        <tr>
            <th scope="row">JetBlue 465</th>
            <td>New York (JFK)</td>
            <td>Portland (PDX)</td>
        </tr>
    </tbody>
</table>

据说，正在努力制作表格

http://jquerymobile.com/branches/tables/docs/tables/index.html

表元素重叠

1 个答案: