如何在< input type = date>上注册价值变动事件在iOS上 [英] How to register for value change events on <input type=date> on iOS

查看:182
本文介绍了如何在< input type = date>上注册价值变动事件在iOS上的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试创建一个HTML5输入日期组件,以便我可以利用本机iOS日期/时间选择器,我正在使用jquery。我有以下代码来生成组件:

I am trying to create an HTML5 input date component so that I can take advantage of the native iOS date/time picker and I am using jquery. I have the following code to generate the component:

  var $inputDate = $("<input></input>");
  $inputDate.attr("type", "date");
  $inputDate.attr("value", "2004-05-03");
  $inputDate.change(function(event)
  {
    console.log("value changed");
  });

代码在本机应用程序中的webkit组件内运行。输入控件显示正常,我可以使用选择器更改值。但是,当我更改值并关闭选择器时,不会触发更改功能。当我在Chrome中的网页中运行此功能时,事情按预期工作。如何在iOS上完成这项工作?

The code is running inside a webkit component in a native app. The input control appears fine and I can change the value using the picker. However, the change function is not triggered when I change the value and dismiss the picker. When I run this in a web page in Chrome, things work as expected. How do I make this work on iOS?

推荐答案

当解除日期/时间选择器时,将调用onblur函数。所以这确实有效:

The onblur function is invoked when the date/time picker is dismissed. So this does work:

var $inputDate = $("<input></input>");
$inputDate.attr("type", "date");
$inputDate.attr("value", "2004-05-03");
$inputDate.blur(function(event)
{
  console.log("value changed");
});

在较新版本的Chrome(以及Android版Chrome)中:

In newer versions of Chrome (and Chrome on Android):


  • 选择日期时调用onchange事件

  • 当下拉列表被取消时,不会调用onblur事件,只控制一次失去键盘焦点

这是一个示例,显示使用纯JavaScript生成哪个事件: http://jsbin.com/iximuy/4

Here is an example showing which event is generated using plain JavaScript: http://jsbin.com/iximuy/4

这篇关于如何在&lt; input type = date&gt;上注册价值变动事件在iOS上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆