javascript - 选择 span 元素中的文本并复制到剪贴板

Question

所以我有以下 html:

<label class="form-group" i18n>Send us your email:</label> <span (click)="select_email()" id="select_email">XYI.runme@previews.emailaddress.com</span>

以及我的 *.component.ts 文件中的以下方法:

select_email() {
    var select_email = <HTMLSpanElement> document.getElementById('select_email');

    select_email.select();

    var successful = document.execCommand('copy');

    console.log("copy to clipboard was successful? " + successful);
}

但是，当它尝试编译时，我收到错误消息:HTMLSpanElement 上不存在 .select()。我也尝试过将类型强制为 HTMLElement，并得到相同的结果。

有没有办法使用 Angular/typescript 选择 span 元素内的文本？我不允许使用 jQuery，因此只允许使用纯 javascript/typescript。

Answer 1

.select() 仅存在于 HTMLInputElement 上。您可以将 span 替换为只读输入元素

<input readonly id="select_email" (click)="select_email()" value="XYI.runme@previews.emailaddress.com">

select_email() {
    var select_email = <HTMLInputElement>document.getElementById('select_email');
    select_email.select();

    var successful = document.execCommand('copy');
}