Javascript 当输入元素没有使用JS聚焦时，如何强制关闭ipad/iphone键盘？_Javascript_Jquery_Ios_Iphone_Ipad

Javascript 当输入元素没有使用JS聚焦时，如何强制关闭ipad/iphone键盘？

javascript jquery ios iphone ipad

Javascript 当输入元素没有使用JS聚焦时，如何强制关闭ipad/iphone键盘？,javascript,jquery,ios,iphone,ipad,Javascript,Jquery,Ios,Iphone,Ipad,我在iframe中有一个输入字段，所以当我单击任何输入字段时，它都会聚焦。但是，如果我再次单击外部（身体区域），iphone键盘不会关闭。每当我明确单击“完成”按钮时，它就会关闭。iFrame中只有iphone和ipad存在问题。这在所有浏览器中都能很好地工作。所以，我尝试了在没有焦点的情况下，调用blur（）或document.activeelement。但他们都没有工作尝试此操作后，会触发焦点，但不会触发focusout document.addEventListener("focusou

我在iframe中有一个输入字段，所以当我单击任何输入字段时，它都会聚焦。但是，如果我再次单击外部（身体区域），iphone键盘不会关闭。每当我明确单击“完成”按钮时，它就会关闭。iFrame中只有iphone和ipad存在问题。这在所有浏览器中都能很好地工作。所以，我尝试了在没有焦点的情况下，调用blur（）或document.activeelement。但他们都没有工作

尝试此操作后，会触发焦点，但不会触发focusout

document.addEventListener("focusout", function(){
      document.activeElement.blur();
  });

有什么办法吗

sample.html

<!doctype html>
<html>
<head>
</head>
<body>
<iframe src="index2.html" width="100%" height="200px"></iframe>
</body>
</html>

<!doctype html>
<html>
<head>
</head>
<body>
<iframe src="index2.html" width="100%" height="200px"></iframe>
</body>
</html>
<script>
    document.getElementById("myframe").addEventListener("load",function()
        {
            document.getElementById("myframe").contentWindow.document.addEventListener("touchend",touchEnd, false);
        }, false
    );

    document.addEventListener("touchend",touchEnd, false);

    function touchEnd(event) {
       if(event.changedTouches[0].target.id != "mytext")
       {
            document.getElementById("myframe").contentWindow.document.getElementById("hidekeyboard").focus();
       }
    }
</script>

index2.html

<!doctype html>
<html>
<head>
<style>
input:focus{
border: 2px solid red;
}
</style>
</head>
<body>
<br></br>
<input type="text" id="myText"/>
</body>
</html>

<!doctype html>
<html>
<head>
<style>
input:focus{
border: 2px solid red;
}
</style>
</head>
<body>
<br></br>
<input type="text" id="myText"/>
<button type="button" id="hidekeyboard" style="width:0px; height:0px; opacity:0;"></button>
</body>
</html>


输入：焦点{
边框：2倍纯红；
}

我不知道为什么

blur（）

不能在iframe内部工作，但是没有iframe它也能工作

所以我做了几个测试，最后我找到了：

alert（）


focus（）
在非文本元素上，如按钮
这里我展示了如何使用focus（）
：
sample.html
<!doctype html>
<html>
<head>
</head>
<body>
<iframe src="index2.html" width="100%" height="200px"></iframe>
</body>
</html>

<!doctype html>
<html>
<head>
</head>
<body>
<iframe src="index2.html" width="100%" height="200px"></iframe>
</body>
</html>
<script>
    document.getElementById("myframe").addEventListener("load",function()
        {
            document.getElementById("myframe").contentWindow.document.addEventListener("touchend",touchEnd, false);
        }, false
    );

    document.addEventListener("touchend",touchEnd, false);

    function touchEnd(event) {
       if(event.changedTouches[0].target.id != "mytext")
       {
            document.getElementById("myframe").contentWindow.document.getElementById("hidekeyboard").focus();
       }
    }
</script>


document.getElementById（“myframe”）.addEventListener（“加载”，函数（）
{
document.getElementById（“myframe”）.contentWindow.document.addEventListener（“touchend”，touchend，false）；
}，错
);
文件。添加了监听器（“touchend”，touchend，false）；
函数touchEnd（事件）{
if（event.changedTouches[0].target.id！=“mytext”）
{
document.getElementById（“myframe”）.contentWindow.document.getElementById（“hidekeyboard”）.focus（）；
}
}

index2.html
<!doctype html>
<html>
<head>
<style>
input:focus{
border: 2px solid red;
}
</style>
</head>
<body>
<br></br>
<input type="text" id="myText"/>
</body>
</html>

<!doctype html>
<html>
<head>
<style>
input:focus{
border: 2px solid red;
}
</style>
</head>
<body>
<br></br>
<input type="text" id="myText"/>
<button type="button" id="hidekeyboard" style="width:0px; height:0px; opacity:0;"></button>
</body>
</html>


输入：焦点{
边框：2倍纯红；
}



dinesh？你没找到答案吗yet@SanKrish：你为什么不把你的答案贴在这里：P？不行，兄弟！我在外面录音时无法关闭键盘，请检查一下。这是iframe问题，无法修复！非常感谢你！我花了很多时间来修好它。我无法使用blur（）。