使用iPad Safari时会出现奇怪的填充<；a href>；及<；输入>；在HTML中_Html_Ipad_Safari_Padding

使用iPad Safari时会出现奇怪的填充<；a href>；及<；输入>；在HTML中

html ipad safari

使用iPad Safari时会出现奇怪的填充<；a href>；及<；输入>；在HTML中,html,ipad,safari,padding,Html,Ipad,Safari,Padding,我正在建立一个用丹麦语进行听写练习的系统，特别是为iPad。到目前为止，我一直在用gnome进行测试，页面看起来很好，但当我最终得到我的iPad时，出现了一些问题我正在用这样的声音构建可点击的句子： <audio id="audiotag6" src=diktat02/gaaet.m4a preload="auto"></audio> <a href="javascript:play_sound('audiotag6');">The sun had &

我正在建立一个用丹麦语进行听写练习的系统，特别是为iPad。到目前为止，我一直在用gnome进行测试，页面看起来很好，但当我最终得到我的iPad时，出现了一些问题

我正在用这样的声音构建可点击的句子：

<audio id="audiotag6" src=diktat02/gaaet.m4a preload="auto"></audio>
<a href="javascript:play_sound('audiotag6');">The sun had   <input type="text" name="word6" autocomplete="off"/>  ned, </a>
<audio id="audiotag7" src=diktat02/koelig.m4a preload="auto"></audio>
<a href="javascript:play_sound('audiotag7');"> and the air was  <input type="text" name="word7" autocomplete="off"/>  klar, </a>

这是我第一个有主页的大项目，这个问题对我来说是一个很大的挫折，因为整个想法是让它在iPad上工作-请帮助。

我发现删除音频标签可以解决这个问题。您可以使用以下布局：

<body>
<audio id="audiotag6" src=diktat02/gaaet.m4a preload="auto"></audio>
<audio id="audiotag7" src=diktat02/koelig.m4a preload="auto"></audio>

<form>
<a href="javascript:play_sound('audiotag6');">The sun had   <input type="text"       name="word6" autocomplete="off"/>  ned, </a>
<a href="javascript:play_sound('audiotag7');"> and the air was  <input type="text" name="word7" autocomplete="off"/>  klar, </a>
</form>
</body>

此外，不应将锚元素放在表单元素内部，而应放在字段类型元素外部。。它可能有效，但语义不准确：）

编辑：

在进一步思考如何以语义更友好的方式实现这一点后，我将thsi放在一起：

<audio>
  <source src="diktat02/gaaet.m4a" id="audiotag6" preload="auto" type="audio/m4a" />
  <source src="diktat02/koelig.m4a" id="audiotag7" preload="auto" type="audio/m4a" />
  Your browser does not support the audio tag.
</audio> 

<form onsubmit="play_sound('audiotag6');">
The sun had   <input type="text" name="word6"  autocomplete="off"/>  ned, 
<input type="submit" value="Play" />
</form>

<br />
<br />

<form onsubmit="play_sound('audiotag7');">
and the air was  <input type="text" name="word7" autocomplete="off"/>  klar,
<input type="submit" value="Play" />
</form>


您的浏览器不支持音频标记。
太阳下山了，




空气是克拉尔，

通过这种方式，您可以避免链接，音频标签可以立即设置，句子的播放机制更清晰，javascript也不那么间接。当然，您将根据自己的喜好决定如何实现此功能，我认为我的解决方案无论如何都不是最好的：）

希望这能有所帮助。

不知何故，是“ned”和“klar”吗？或者这是您的示例中的输入错误？在元素中输入元素。

<audio>
  <source src="diktat02/gaaet.m4a" id="audiotag6" preload="auto" type="audio/m4a" />
  <source src="diktat02/koelig.m4a" id="audiotag7" preload="auto" type="audio/m4a" />
  Your browser does not support the audio tag.
</audio> 

<form onsubmit="play_sound('audiotag6');">
The sun had   <input type="text" name="word6"  autocomplete="off"/>  ned, 
<input type="submit" value="Play" />
</form>

<br />
<br />

<form onsubmit="play_sound('audiotag7');">
and the air was  <input type="text" name="word7" autocomplete="off"/>  klar,
<input type="submit" value="Play" />
</form>