0

我有一个要在 iOS 设备中运行的 web 应用程序，我试图通过单击特定标签来调用本机 datePicker。

我知道如果我有一个<input type='date'>它会通过触摸它来打开本地日期选择器。

我的策略是将这个输入与“不透明度：0”放在标签下，并将标签的点击事件绑定到输入的触发事件，如下所示：

$('#pickerLabel').bind('click',function () {
    $('#pickerInput').trigger('click');
});
$('#pickerInput').click(function () {
    alert("open Picker");
});

我观察到的是，这个方法只是触发了绑定到点击事件的函数（它会提示“打开 Picker”），但它并没有打开原生 iOS datePicker，就好像我点击了输入本身一样。

你能帮助我吗？

PS：我的项目中还包含 jquery 移动框架，我尝试在输入中使用点击事件并得到完全相同的结果。

4

2 回答 2

1

您是否尝试过启动 WebKit 触摸事件？

var touchEvent = document.createEvent('TouchEvent');
touchEvent.initTouchEvent(type, canBubble, cancelable, view, detail, screenX, screenY, clientX, clientY, ctrlKey, altKey, shiftKey, metaKey, touches, targetTouches, changedTouches, scale, rotation);

https://developer.apple.com/documentation/webkitjs/touchevent

一个（未经测试的）示例可能如下所示：

$('#pickerLabel').bind('click', function(){
    var touchEvent = document.createEvent('TouchEvent');
    touchEvent.initTouchEvent('touchstart', true, true, document.getElementById('pickerInput'), null, 0, 0, 0, 0, false, false, false, false, [], [], [], 1.0, 0.0);
});
于 2012-07-02T09:52:40.983 回答
0

我设法通过以下方式解决了这个问题：我将标签和输入放在两个不同的 div 中。我将两个 div 放在一起，让输入 div 具有更高的 z-index（并将不透明度保持为 0）。

我在这个论坛问题中使用了 CSS：如何将一个 div 覆盖在另一个 div 上

这仍然只是一种没有所需行为的解决方法。

于 2012-07-02T10:49:30.540 回答