Jquery UI Datepicker不关注输入

Question

我正在尝试使用 jquery ui datepicker 创建一个表单。
一切正常，除了因为我更改了输入字段的设计，因此在选择日期时不会删除占位符属性。

这是小提琴：https://jsfiddle.net/deqguphb/

HTML

<form>
     <ol>
         <li>
           <input id="input1" name="input1" value="" placeholder="Input1: Working just fine"/>
           <label for="input1">Input1</label>
         </li>
         <li>
           <input id="input2" name="input2" value="" placeholder="Input2: The placeholder stays" />
           <label for="input2">Input2</label>
         </li>
         <li>
           <input id="input3" name="input2" value="" placeholder="Input3: The placeholder stays" />
           <label for="input3">Input3</label>
         </li>
    </ol>
</form>

Javascript

/* The focus effect */
$("input:not([value]),input[value='']").addClass('empty');

/* Input event handling */
$('input').on('input keyup', function() {  
      $(this).toggleClass('empty', !Boolean($(this).val()));
});

我不知道选择日期后会触发什么事件。我尝试使用 onKeyup 和 onChange 但这并没有解决问题。

我会非常乐意为此提供解决方案。

Answer 1

我已经更新了你的小提琴，

我在每个占位符文本框中添加了两个事件。

onfocus="this.placeholder = ''" onblur="this.placeholder = 'Input1: Working just fine'"

小提琴是：https://jsfiddle.net/deqguphb/4/

您需要为文本框使用焦点和模糊事件。

希望对你有帮助:)