半角0.5全角1でインプットの入力を数えた値を合計し、インプットを削除した場合合計から引きたい

Question

追加削除が可能なinput要素を作って半角（半角英数：123AbCなど）全角（全角かな：明日あさって等）が混ざった状態で入力されているinputの文字数を半角0.5全角1でカウントし数えた値を合計し、またインプットを削除した場合は合計から引きたいです

下記でinputセットを追加・削除しています。

//追加するhtmlセット
<div class="hash_set_template_inst">
<div class="hash_block">
<input type="text" placeholder="" class="" autocomplete="off" value="#">
<button type="button" class="hash_del"><span><i>削除</i></span></button>
</div></div>

<div class="hash_area fb">
<p class="txt_cnt"><span class="fb_txt">0</span>文字</p>
<div class="hash_fb">
<p class="add_area"><button type="button" class="add_hash_btn inst_hash">追加</button></p>
</div>
</div>

//セットの追加
  $(".add_hash_btn.inst_hash").on("click",function () {
    var html = $('.hash_set_template_inst').html();
    var hash_set_t = $.parseHTML(html);
    var append = $(this).parent('.add_area');
    append.before(hash_set_t);
  });
//セットの削除
  $(document).on('click', '.hash_del', function () {
　var elm = $(this).closest('div');
      elm.remove()
  });

$(document).on("keyup change",".hash_fb input",function(){

 var o = $(this);
    var str = o.val();
    var r = 0;
    for (var i = 0; i < str.length; ++i) {
      var c = str.charCodeAt(i);
      if (c >= 0x0 && c <= 0x7f) {
        r += 1;
      } else {
        r += 2;
      }
    }
var all = r/2
console.log(all) //ここまでで各インプットの全半角数は出ています

var total = 0;
    $( ".hash_fb input" ).each( function() {
      total += all 
//ここで合計しているつもりなのですが入力するたびに0からはじまってしまいinputの全角半角も全て１で計算されてしまいます。
    } )
    $( ".fb_txt" ).text(total);

});

またこちらで（https://teratail.com/questions/216377）全半角関係なく1とした場合の合計は解決しています。

Comments

[sense6n23rp]

一度自分で組んだものをhttps://teratail.com/questions/216377でご解答いただき（左記の質問・解答自体やりたいこと全てを含んでいるものではなくそこから自分で組んでいく想定で質問しています）、手を加えて思ったものに近いものへ進めたが詰まってしまった
これが「やってほしいことだけを記載した丸投げの質問」にあたるのでしょうか？
htmlもjsも載せずに本当にタイトルと質問だけの丸投げであれば納得できますが・・・
またなぜhttps://teratail.com/questions/216377には丸投げといわれなかったのでしょうか？

Answer 1

ここで合計しているつもりなのですが入力するたびに0からはじまってしまいinputの全角半角も全て１で計算されてしまいます。

当方でご提示のコードを試してみましたが、現状認識に錯誤があると思われます。そのような動作はしませんでした。

total += all

↑ここでのall変数の中身は、イベントのあったinput要素の文字数ですから、それがinput要素の数だけ足されます。
たとえば、input要素が、

#1
#2
#いろは←これを変更した

という状態でしたら、3.5を3回足すので、3.5*3=10.5になるはずです。
「0からはじまってしまい」というのはたまたまinput要素が空から始まっていただけで、「全角半角も全て１で計算されてしまいます」というのはたまたまinput要素が2つだっただけです。

解決方法は、文字数を要素ごとに取得することです。

Comments

[sense6n23rp]

なるほど。
確かにそのようでした。
と言うことは元の

$( document ).on( "keyup change", ".hash input", function() {
var total = 0;
$( ".hash_ input" ).each( function() {
total += $( this ).val().length;
} );
$( ".txt" ).text(total);
} );
の時点で間違っていたということになりますね

[Lhankor_Mhy]

それは間違っていません。

[sense6n23rp]

ありがとうございます

htmlを
<input type="text" placeholder="" class="" autocomplete="off" value="#"><span class="tc">0</span>
として

$(document).on("keyup change",".hash_fb input",function(){
～～～
～～～
$(this).next(".tc").text(all);
var i = 0
var total = 0;
$( ".hash_fb input" ).each( function() {
i++;
var sub_count = $(".t" + i).text()
var result = parseInt(sub_count)
total += result
} )
$( ".fb_txt" ).text(total);
としてみたらできました

Answer 2

まずは、あなたのいう半角、というのと、全角というものの定義をはっきりさせる必要がありますね。
それがわからないと答えようがないです。

---

（追記）
なら、スペース（0x20）から、バッククオート（0x7e）の範囲内の文字を0.5とし、それ以外を１として加算していけばいいということになりますねー

Comments

[sense6n23rp]

半角は半角英数（123AbCなど）全角は全角かな（明日あさって等）です
質問文も分かりにくかったので変更します

[y_waiwai]

おそらく、文字幅に関わるものと思われますが、文字幅が狭いフォントも存在すると思うんですが、英数以外は全角に決め打ちしていいんでしょうか
ならはなしははやいんですけどｗ

[sense6n23rp]

単純に半角入力文字は半角、全角入力文字は全角と言う認識で問題ないです
フォントは無視していただいて、また半角カナも無視して頂いて問題ないです

[y_waiwai]

なら、スペース（0x20）から、バッククオート（0x7e）の範囲内の文字を0.5とし、それ以外を１として加算していけばいいということになりますねー

[sense6n23rp]

ですがすでにその部分は
var c = str.charCodeAt(i);
if (c >= 0x0 && c <= 0x7f) {
r += 1;
} else {
r += 2;
}
}
var all = r/2
で解決していますが他にも書く必要があるというご指摘ですか？
それともわざわざrを/2しているというご指摘でしょうか？

[y_waiwai]

そこは間違ってませんが、質問の書いてあるとおりに不具合があるというなら、その他のところが間違ってるんでしょうね

[sense6n23rp]

は？
それを聞くのがこの場所ではないのですか？
不具合がないのならここで聞く必要ないですよね。

[sense6n23rp]

すいませんね、あなたのプロフィールから解答一覧を見させていただきました・・・
以後返信は結構です。

[y_waiwai]

別に私は返信を遠慮する義理はないのでそっちでどーにかしましょうねっｗ

[sense6n23rp]

ではあなたには頭をどうにかしてもらいますね

[y_waiwai]

いやー、頭をどうにかする義理もないんですがｗこっちきてやります？ｗ

[sense6n23rp]

いいですよ。
まずあなたの言う「こっち」というのの定義をはっきりする必要がありますね。
それがわからないと行きようがないです。

[y_waiwai]

うん、行きようがないものはしようがないですもんねｗ

[sense6n23rp]

どこに行けばいいか教えてくれないのでしょうか？
結局あなたはどの質問にもまともに解答しないのですね。

[y_waiwai]

そうですよ？
解答を出すといったことはないですし、出すつもりで回答してるわけでもないですねｗ

[sense6n23rp]

暇なんですね。
私はいまこの質問の件解決できたので手があきました。
ただもう少ししたら仕事に戻りますね。

[y_waiwai]

そりゃヒマですよ。
そうじゃなかったらこんなところでたむろってません。

おつかれさんです。がんばってください