電話番号フォームに数値を入力して正しいかどうか判断するJavasctiptについて

javascriptの学習を始めて、数日のど素人です。
勉強として、電話番号フォームに入力された数値が正しいかどうか
（10桁もしくは、11桁の数値ならＯＫ）判断し、それ以外（9桁以下、もしくは文字・記号など）
なら、「正しく入力し直してください」と表示するコードを作りたいのですが、いまいちうまくいきません。
このイベントが発生するタイミングは、数値を入力して、enterキーを押すタイミングで行いたいと思い、oninputを入れたのですが、うまくいきませんでした。
ご教示いただけますと幸いです。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <link rel="stylesheet" href="style.css">
7    <title>javascripのテスト</title>
8</head>
9<body>
10    <form action="#" id="form">
11        <p>電話番号入力：<input type="text" name="telNumber" placeholder="ハイフン無しで入力ください。" maxlength="11"></p>
12    </form>
13    <script src="test.js"></script>
14</body>
15</html>

Javascript
1
2document.getElementById('form').telNumber.value.oninput = function(){
3    if (form.maxlength === 10 ||form.maxlength === 11){
4        console.log('正しく入力されています。');
5    } else {
6        window.alert('正しく入力し直してください。');
7    }
8}

行動規範の内容に同意します

回答3件

ベストアンサー

ざっくりこんな指定をするとよいでしょう

HTML
1<form>
2<input type="text" name="tel" maxlength="11" minlength="10" pattern="[0-9]+" placeholder="10-11桁の数値">
3<input type="submit" value="send">
4</form>

投稿2020/05/24 14:18

yambejp

総合スコア116724

takochan1192

2020/05/25 04:36

この2行でばちっとできました。ありがとうございました。こんなに、短いコードでいいんですね！！不勉強でお恥ずかしい限りです。本当にありがとうございました！！

行動規範の内容に同意します

恐らく、この辺で解決できそうな気がします。
https://its-office.jp/blog/js/2017/08/19/telmatch.html

上記より引用ですが

javascript
1<script>
2var tel = document.getElementById('tel').value.replace(/[━.*‐.*―.*－.*\-.*ー.*\-]/gi,'');
3if (!tel.match(/^(0[5-9]0[0-9]{8}|0[1-9][1-9][0-9]{7})$/)) {
4	error.innerText = 'エラーメッセージ';
5}
6</script>