I have this code
this.mdc_text = mdc.textField.MDCTextField.attachTo(this.$el);
if (this.autofocus) {
this.mdc_text.activateFocus();
}
but the function activateFocus is undefined. How can I focus it?
/
Thanks
I have this code
this.mdc_text = mdc.textField.MDCTextField.attachTo(this.$el);
if (this.autofocus) {
this.mdc_text.activateFocus();
}
but the function activateFocus is undefined. How can I focus it?
https://material.io/develop/web/ponents/input-controls/text-field/
Thanks
Share Improve this question edited Oct 29, 2018 at 22:40 benvc 15.2k4 gold badges38 silver badges57 bronze badges asked Oct 29, 2018 at 20:48 omegaomega 44.1k90 gold badges286 silver badges523 bronze badges1 Answer
Reset to default 4activateFocus
is used with MDCTextFieldFoundation
when creating a ponent for a framework. In your case, it looks like you are trying to programmatically focus an MDC textfield, so use the focus
method instead.
const field = mdc.textField.MDCTextField.attachTo(document.querySelector('.mdc-text-field'));
field.focus();
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Material TextField</title>
<link rel="stylesheet" href="https://fonts.googleapis./icon?family=Material+Icons">
<link rel="stylesheet" href="https://fonts.googleapis./css?family=Roboto:300,400,500,700">
<link href="https://unpkg./material-ponents-web@latest/dist/material-ponents-web.min.css" rel="stylesheet">
<script src="https://unpkg./material-ponents-web@latest/dist/material-ponents-web.min.js"></script>
</head>
<body>
<label class="mdc-text-field mdc-text-field--filled">
<span class="mdc-text-field__ripple"></span>
<input class="mdc-text-field__input" type="text">
<span class="mdc-floating-label">Hint text</span>
<span class="mdc-line-ripple"></span>
</label>
</body>
</html>
As an aside, if you want a the TextField to be automatically focused on page load, then you can add the autofocus
attribute to the input
element in your html.
发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745582407a4634333.html
评论列表(0条)