我刚刚在一个神秘的问题上花了太多时间。我通过谷歌没有找到任何东西。我想分享这一发现。
这是在 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)。但这将禁用您页面上的所有电话号码链接...
关于javascript - innerHTML 不适用于 iPhone,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40655110/