H5 when type is date, and the onchange method is added on the mobile end, the ios mobile phone date control disappears without confirming it.

the frame used is angularjs
the code is

<input type="date" id="beginDate" name="beginDate" ng-model="beginDate"
              placeholder="yyyy-MM-dd" ng-change="dosth()" required />

the above code works normally on Android phones
but on ios phones, I slightly scratch the system date control. Before I click OK, ios hides the date control by itself and executes my dosth method at the same time. This user experience is so bad that if the phrase "dosth ()" of ng-change= is removed, it can be used normally again. But the switching event cannot be performed
is there any good way to solve my problem

Apr.09,2021

try using the onchange event directly


the problem is very simple, but also because I am inexperienced. The angularjs framework is on the mobile side, and its date components and ng-change execution time are different on Android and iOS. Android executes ng-change events when you click OK, and ios executes ng-change events when you click on the component, so you only need to change it to ios executing events in blur state.
the specific method is

<input type="date" id="beginDate" name="beginDate" ng-model="beginDate"
              placeholder="yyyy-MM-dd" ng-change="dosth()" ng-blur="dosth2()" required />

determine whether it is Android or ios, in the dosth and dosth2 methods and then execute the corresponding event.
of course, the best and recommended method is to encapsulate it into an instruction. I won't talk about it here, but you can talk to me in private if necessary.

Menu