jquery - 文本框中仅允许半角片假名(日语)字符

Question

在我的 Rails 应用程序中，我有一个像这样的文本字段

<%= f.text_field :guaranter_furigana_name, autocomplete: "off", class: "form-control", placeholder: "例：ヤマダ タロウ（全角カナ）", maxlength: "50",  :disabled => @disabled_field %>

我正在使用 jQuery 来验证此文本字段仅接受 half width katakana字符(Unicode 值从 ff60 到 ff9f)。这是我尝试过的

// Allow only half width kana for guranter フリガナ
$(function (){
  $("#t_user_name_register_guaranter_furigana_name").on("input", function(e){

    var key = e.keyCode || e.charCode;

    var inp = String.fromCharCode(key);

    var kanaregexp = new RegExp('[\uff00-\uff9f]');
    if (kanaregexp.test(inp) != true){
      if( key != 8 && key != 46 && key != 32){
        inp = $(this).val();
        $(this).val(inp.slice(0,-1));
        $("#telno_errmsg").html("半角カナ字のみを入力してください。").show().fadeOut(3000);
        return false;
      }
    }
  });
});

代码很困惑并且并不总是有效。请帮忙

Answer 1

适合在使用日语文本时寻找不同 jQuery 验证规则的人。

//平假名和片假名

jQuery.validator.addMethod("kana", function(value, element) {
 return this.optional(element) || /^([ァ-ヶーぁ-ん]+)$/.test(value);
 }, "<br/>全角ひらがな･カタカナを入力してください"
);

//只有平假名

jQuery.validator.addMethod("hiragana", function(value, element) {
 return this.optional(element) || /^([ぁ-ん]+)$/.test(value);
 }, "<br/>全角ひらがなを入力してください"
);

//只有片假名

jQuery.validator.addMethod("katakana", function(value, element) {
 return this.optional(element) || /^([ァ-ヶー]+)$/.test(value);
 }, "<br/>全角カタカナを入力してください"
);

//半字符假名

jQuery.validator.addMethod("hankana", function(value, element) {
 return this.optional(element) || /^([ｧ-ﾝﾞﾟ]+)$/.test(value);
 }, "<br/>半角カタカナを入力してください"
);

//仅限字母

jQuery.validator.addMethod("alphabet", function(value, element) {
 return this.optional(element) || /^([a-zA-z\s]+)$/.test(value);
 }, "<br/>半角英字を入力してください"
);

了解更多，check here