触发文本光标编程就像用户实际点击输入标签

Question

我试着输入一些数值到文本字段中使用JavaScript，如Gmail电子邮件输入标签。 但问题发生了一些花哨的动画为他们的占位符绑定到一些事件，我不知道如何触发的，比如图像显示如下： 输入后 ：

输入标签没有焦点/选择输入的东西有： 与焦点输入标签/选择：

然后我分配的价值，我的价值和花哨的占位符会互相重叠后。

我试过多种方式，重点/选择/点击/两，没有什么工作。所以我在想，如果我可以触发像用户那样的动画，实际上点击它然后赋值给它可能工作。

我该如何做到这一点？或者是否有任何其他方式让该动画或其输入检查代码捕获我指定的值，那么在该占位符不会降低并重叠我的值之后？

Answer 1

我不知道你如何建立你的输入，所以有可能是处理它更简单的方法。 因为我个人使用JQuery我会用.toggle()函数来做。

$(element).toggle(); 

您也可以更改CSS与.css()功能属性。只需创建一个聚焦事件并更改其中的颜色等。

希望那是有你要的。 祝你好运:)

Answer 2

您可以使用jQuery的距离和focus和focusout与removeClass和addClass切换类。

例如，你可以做这样的：

$("input").focus(function(){ 
    $(this).parent().addClass("is-active is-completed"); 
}); 

$("input").focusout(function(){ 
    if($(this).val() === "") 
    $(this).parent().removeClass("is-completed"); 
    $(this).parent().removeClass("is-active"); 
}) 

您也可以使用materialize css's input。