只有当用户输入第一个字符时,paper-input 才会 float 其标签。是否可以在用户点击后立即 float 标签?例如,引用 https://unacademy.in/登录屏幕输入字段。
最佳答案
您可以使用 always-float-label
, no-label-float
paper-input
的属性/属性 在一个on-click
事件中实现这一点。 paper-input
demo展示了如何使用 always-float-label
、no-label-float
属性。
演示可以是
<!DOCTYPE html>
<html>
<head>
<title>Label float</title>
<script src="https://rawgit.com/webcomponents/webcomponentsjs/master/webcomponents.js"></script>
<base href="https://cdn.rawgit.com/download/polymer-cdn/1.0.1/lib/">
<link rel="import" href="paper-input/paper-input.html">
</head>
<body>
<my-form></my-form>
<dom-module id="my-form">
<template>
<paper-input name="name" id="name" label="name" on-click="_click" on-blur="_blur"></paper-input>
</template>
<script type="text/javascript">
Polymer({
is:"my-form",
_click:function (){
//console.log(this.$.name.value);
this.$.name.alwaysFloatLabel=true;
},
_blur:function(){
this.$.name.alwaysFloatLabel=false;
}
})
</script>
</dom-module>
</body>
</html>
关于material-design - paper-input - 单击输入字段时 float 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35666602/