iPad HTML兼容性

时间:2012-08-06 17:12:14

标签: html ipad compatibility

我已经为多项选择问题生成了HTML,只需使用一个包含问题的png和多个选择答案,每个答案都包含一个自己的png。我希望用户能够点击他们选择的答案,然后转到下一个问题。

在测试中,我发现它使用标准浏览器完美运行,但在iPad上我无法点击答案选项。我不熟悉iPad的HTML要求/限制。我想我正在做一些苹果的iPad版safari不支持的东西,虽然我不知道它会是什么。

这是身体:

<body onload="init('single')" class="single">
<div id="navBar">
  <div id="testButtons" class="formButtons"><button id="submitButton"><img src="../assets/check2.png">I'm done</button><button id="resetButton"><img src="../assets/delete2.png">Start over</button></div>
  <div id="resultsButtons" class="formButtons"></div>
</div>
<div id="test">
  <form>
    <div class="problem" id="problem-1">
      <div class="problemLabel"><span>Problem 1</span></div><img class="stem" src="1.png"><table class="answer">
        <tbody>
          <tr>
            <th><input type="radio" name="rg-1" id="rb-1-1" class="false"><label for="rb-1-1">&#65;</label></th>
            <td><label for="rb-1-1"><img src="1-1.png"></label></td>
          </tr>
          <tr>
            <th><input type="radio" name="rg-1" id="rb-1-2" class="false"><label for="rb-1-2">&#66;</label></th>
            <td><label for="rb-1-2"><img src="1-2.png"></label></td>
          </tr>
          <tr>
            <th><input type="radio" name="rg-1" id="rb-1-3" class="true"><label for="rb-1-3">&#67;</label></th>
            <td><label for="rb-1-3"><img src="1-3.png"></label></td>
          </tr>
          <tr>
            <th><input type="radio" name="rg-1" id="rb-1-4" class="false"><label for="rb-1-4">&#68;</label></th>
            <td><label for="rb-1-4"><img src="1-4.png"></label></td>
          </tr>
        </tbody>
      </table>
    </div>
  </form>
</div>
<div id="results">
  <h3 id="testcomplete">Online Test Complete!</h3>
  <div id="resultsHeader">
    <table class="summary">
      <tbody>
        <tr>
          <th>Title</th>
          <td>single_question_test</td>
        </tr>
        <tr>
          <th>Correct</th>
          <td id="problemsCorrect"></td>
        </tr>
      </tbody>
    </table>
  </div>
</body>

任何帮助将不胜感激!希望它可以像iPad一样使用不同的按钮类型。

1 个答案:

答案 0 :(得分:0)

请参阅here

如果我不得不猜测,你的桌面元素覆盖了iPad上的输入元素,这不允许触摸事件。我会尝试制作一个只有单选按钮的HTML页面,确保它们是可点击的,然后按照这种方式工作。