javascript - innerHTML无法在iPhone上运行

我在一个神秘的问题上花了太多时间。我没有通过Google找到任何东西。我想分享这个发现。

以下代码可在PC上产生预期结果，但在iPhone上却出乎意料：

var input = document.getElementById('input');
var output = document.getElementById('output');
output.innerHTML = parseInt(input.innerHTML);

<div id="input">1233453455</div>
<div id="output"></div>

预期结果：

1233453455
1233453455

iPhone结果：

1233453455
NaN

为什么？

最佳答案

iPhone在执行javascript代码之前更改了innerHTML内容！ “长号”被解释为电话号码（本例中不是），并在innerHTML内添加了tel链接。观察alert窗口显示的内容（在iPhone上的以下脚本中执行）：

var input = document.getElementById('input');
var output = document.getElementById('output');
alert('input content: ' + input.innerHTML)
output.innerHTML = parseInt(input.innerHTML);

<div id="input">1233453455</div>
<div id="output"></div>

因此，存在“意外结果”的原因。

作为解决方案：就我而言，我只是将文本切换到其他容器（我使用了data-属性）：

var input = document.getElementById('input');
var output = document.getElementById('output');
output.innerHTML = parseInt(input.getAttribute('data-test'));

<div id="input" data-test="1233453455">1233453455</div>
<div id="output"></div>

另一个似乎被描述为here（感谢@epascarello for pointing this out）。但这将禁用您页面上所有的电话号码链接...

iphone

javascript - innerHTML无法在iPhone上运行