16

私はこの質問に対する答えを調べようとしましたが、迷子になりました。電話番号に自動的にダッシュを入れる検索バーを1つ作成しようとしています。私はそれを解決しました。

次の部分は挑戦的な部分です。貼り付けられた文字が5555551212や555---555-1212のようで、番号をリールバックして555-555-1212で出力する場合でも、常にXXX-XXX-XXXXを実行するにはどうすればよいですか。スペースや余分なダッシュを文字として数えるべきではありません。

私が見つけた：http：//www.jotform.com/answers/15202-can-I-add-script-to-my-form-that-will-automatically-add-hyphens-in-between-the-3-digit -area-code-and-also-the-3-digit-prefix

次を追加して少し変更しました。

<SCRIPT LANGUAGE="JavaScript">
        function addDashes(f)
            {
                f.value = f.value.slice(0,3)+"-"+f.value.slice(3,6)+"-"+f.value.slice(6,15);
            }
    </SCRIPT>


<input id="input_4" class="form-textbox" maxlength="15" name="atn" size="25" onBlur='addDashes(this)' />

現在、これは、ユーザーが5555555555を入力し、自動的に555-555-5555に変換した場合にのみ機能します。5-55555-5555のようなものを555-555-5555に変換する方法を見つけようとしています。現在、5-5-555-5-5555になっています。

私のジレンマを見ますか？笑。これはデスクトップで実行できる必要があるため、phpやサーバーサイドスクリプトにすることはできません。

解像度：

<SCRIPT LANGUAGE="JavaScript">
        function addDashes(f)
            {
                f.value = f.value.replace(/\D/g, '');

                f.value = f.value.slice(0,3)+"-"+f.value.slice(3,6)+"-"+f.value.slice(6,15);
            }
    </SCRIPT>
4

6 に答える 6

24

まず、数字ではないすべての文字を削除して入力をクリーンアップします（参照：数字と小数点を除くすべてを置き換える正規表現）

次に、ダッシュを入れます。

function addDashes(f)
{
    f_val = f.value.replace(/\D[^\.]/g, "");
    f.value = f_val.slice(0,3)+"-"+f_val.slice(3,6)+"-"+f_val.slice(6);
}
于 2012-10-26T19:32:10.767 に答える
8

私は電話番号をフォーマットなしの10桁の直線文字列として扱う傾向が強いです（したがって、必要に応じてその場でフォーマットを適用できるため、検索と比較が簡単になります）。国際電話番号を処理する必要があります。扱っているのが米国の電話番号だけの場合、これはうまく機能します（入力したとおりにフォーマットします）。

function addDashes(f) {
    var r = /(\D+)/g,
        npa = '',
        nxx = '',
        last4 = '';
    f.value = f.value.replace(r, '');
    npa = f.value.substr(0, 3);
    nxx = f.value.substr(3, 3);
    last4 = f.value.substr(6, 4);
    f.value = npa + '-' + nxx + '-' + last4;
}​

これがフィドルです：http：//jsfiddle.net/EYuk5/

于 2012-10-26T19:39:04.570 に答える
0

これを試して：

  function dashedNumber(value){
    const afterIndices = [3,6,8]; 
    const length = value.length;
    let newValue = '' 
    for(let i=0; i<length; i++){
      if(afterIndices.includes(i))
        newValue+='-'
      newValue+=value[i];
    }
    return newValue;
  }
于 2020-07-04T11:30:40.337 に答える
0

これは私がしました

function addDashesToNumber(number){
    const numWithoutDashes = number.replace(/[^0-9]/g, '')
    if(numWithoutDashes.length > 10) return number.slice(0, -1)
    const dashPlaces = [3, 6]
    return numWithoutDashes
                .split('')
                .reduce((acc, curr, i) => dashPlaces.includes(i) ? [...acc, '-', curr] : [...acc, curr], [])
                .join('')
}
于 2021-06-16T15:12:21.590 に答える
0

これがフィドルです：https ：//jsfiddle.net/v9gq5jkw/ 。

<input id="phone">

function phone_formatting(ele, restore) {
  var new_number,
    selection_start = ele.selectionStart,
    selection_end = ele.selectionEnd,
    number = ele.value.replace(/\D/g, '');

  if (number.length > 2) {
    new_number = number.substring(0, 3) + '-';
    if (number.length === 4 || number.length === 5) {
      new_number += number.substr(3);
    } else if (number.length > 5) {
      new_number += number.substring(3, 6) + '-';
    }
    if (number.length > 6) {
      new_number += number.substring(6);
    }
  } else {
    new_number = number;
  }

  ele.value = (new_number.length > 12) ? new_number.substring(0, 12) : new_number;

  if (new_number.slice(-1) === '-' && restore === false &&
    (new_number.length === 8 && selection_end === 7) ||
    (new_number.length === 4 && selection_end === 3)) {
    selection_start = new_number.length;
    selection_end = new_number.length;
  } else if (restore === 'revert') {
    selection_start--;
    selection_end--;
  }
  ele.setSelectionRange(selection_start, selection_end);

}

function phone_number_check(field, e) {
  var key_code = e.keyCode,
    key_string = String.fromCharCode(key_code),
    press_delete = false,
    dash_key = 189,
    delete_key = [8, 46],
    direction_key = [33, 34, 35, 36, 37, 38, 39, 40],
    selection_end = field.selectionEnd;

  if (delete_key.indexOf(key_code) > -1) {
    press_delete = true;
  }

  if (key_string.match(/^\d+$/) || press_delete) {
    phone_formatting(field, press_delete);
  } else if (direction_key.indexOf(key_code) > -1) {} else if (dash_key === key_code) {
    if (selection_end === field.value.length) {
      field.value = field.value.slice(0, -1)
    } else {
      field.value = field.value.substring(0, (selection_end - 1)) + field.value.substr(selection_end)
      field.selectionEnd = selection_end - 1;
    }
  } else {
    e.preventDefault();
    phone_formatting(field, 'revert');
  }

}

document.getElementById('phone').onkeyup = function(e) {
  phone_number_check(this, e);
}
于 2021-09-11T21:41:47.283 に答える
-2

ダッシュを追加する以外に、特に削除の場合は、カーソルの位置を処理する必要があります。

このAMDモジュールはまさにそれを行います：https ：//github.com/whenyoubelieve2014/us-telephone-input

于 2015-02-23T19:06:40.503 に答える