selectboxのblurイベント時に何度も同じ処理が行われてしまう

###前提・実現したいこと
プログラミングを始めたばかりの初心者です。
変なことをお聞きしているかもしれません。。。
申し訳ありません。

現在PHP(フレームワークはfuelphpを使用)、smartyテンプレート、
Mysqlを使用しながら、「お問い合わせフォーム」と、
「お問い合わせ管理」画面を作成しています。
現在、「お問い合わせ管理」でテーブル上に一覧表示されているデータのうち、
特定の項目のセルをクリックすると、
その部分がセレクトボックスで編集可能になり、
セレクトボックスからフォーカスが外れたときに、
変更内容がそのまま保存される、という動きを作っています。
勉強のため、昨日よりjQueryを勉強しながら取り組んでいます。

###発生している問題・エラーメッセージ
テーブル上の項目をクリックした際に、
その点がセレクトボックスに切り替わるという動きと、
フォーカスが外れた際に、セレクトボックスが消えて、
文字列だけになる、という動きはなんとか実装できました。

ただ、フォーカスをはずした際の動きを
console.logを置きながら確認していたところ、
(1) 項目をクリックしてセレクトボックスを表示させて
何もせずにフォーカスをはずす
(2) 項目をクリックしてセレクトボックスを表示させて
他方の項目を選択してフォーカスをはずす
(3) 項目をクリックしてセレクトボックスを表示させて
何度か項目を切り替えてフォーカスをはずす
という動作を行ったときに、
(1)は1回しかblurの処理が呼ばれていないのですが、
(2)では3回、
(3)では3×項目を切り替えた回数分、
blurのイベントが呼ばれてしまっていることが分かりました。

このあと、blurのイベントにおいて、
データの保存を実装していきたいと考えているので、
何度も処理が呼ばれるのは良くないなと考えております。
分かりにくい説明で恐縮ですが、
下記のソースコードの中でおかしな部分(だらけだと思いますが･･･)をご教示頂けますと幸いでございます。
何卒、宜しくお願い申し上げます。

###該当のソースコード

html
1※smartyテンプレートを使用しているため、{}内は変数だとお考えください。
2 今回は『対応状況(td class="status")』の項目をクリックした際に、
3 セレクトボックスで「未処理」「処理済」と選択できるようにしています。
4 
5<div class="row inquery">
6	<div class="col-md-12">
7		<p class="form-title">登録内容一覧</p>
8	</div>
9	<div class="col-md-12">
10		<form name="mainForm" action="" method="POST" >
11			<table id="table">
12				<tr>
13					<th class="date">問合せ日時</th>
14					<th class="category">問合せ種別</th>
15					<th class="comment-th">問合せ内容</th>
16					<th class="name">お客様名</th>
17					<th class="age">ご年齢</th>
18					<th class="sex">性別</th>
19					<th class="pref">都道府県</th>
20					<th class="status">対応状況</th>
21					<th class="date">対応日時</th>
22					<th class="staff">対応者</th>
23					<th class="link"></th>
24				</tr>
25
26				{foreach from=$data item='val'}
27				<tr>
28					<td class="date">{$val.inq_date}</td>
29					<td class="category">
30						{if $val.inq_category === 'ご購入方法について'}購入方法について
31						{elseif $val.inq_category === 'ご購入頂いた商品について'}商品について
32						{elseif $val.inq_category === '当社について'}当社について
33						{elseif $val.inq_category === 'その他'}その他
34						{/if}
35					</td>
36					<td class="comment-td">{$val.inq_comment}</td>
37					<td class="name">{$val.inq_name}</td>
38					<td class="age">{$val.inq_age}</td>
39					<td class="sex">{$val.inq_sex}</td>
40					<td class="pref">{$val.inq_pref}</td>
41					<td class="status">{$val.res_status}</td>
42					<td class="date">{$val.res_date}</td>
43					<td class="staff">{$val.res_staff}</td>
44					<td class="link"><a href="view/{$val.id}">詳細</a></td>
45				</tr>
46				{/foreach}
47			</table>
48		</form>
49	</div>
50</div>

javascript
1昨日から着手し、一つずつ動きを把握していくために、
2該当するセルをクリックすると、クリックしたセルの内容をコンソールに出力する、
3という下記『原型』のソースを少しずつ拡張して作っています。
4
5/* 原型 */
6/*$(function(){
7    $('td[class=status]').click(function(){
8        console.log('内容：' + $(this).text());
9    }); 
10});*/
11
12
13/* 上記を元に作ってみる */
14$(function(){
15    $('td[class=status]').click(function(){
16        /*(1) onクラスを持っていなければ付与する */
17        if(!$(this).hasClass('on')){
18            $(this).addClass('on');
19            /*(2) クリックした時にセレクトボックスに表示を変える */
20            var txt = $(this).text();
21            if(txt === '未処理')
22            {
23                $(this).html('<select><option value="未処理" selected>未処理</option><option value="処理済">処理済</option></select>');
24            }
25            else if(txt === '処理済')
26            {
27                $(this).html('<select><option value="未処理">未処理</option><option value="処理済" selected>処理済</option></select>');
28            }					
29        }
30        /*(3) focusが外れたら元に戻る */
31        $(this).children("select").focus().blur(function(){
32            console.log('フォーカスアウト発動');
33            var inputVal = $(this).val();
34            $(this).parent().removeClass('on').text(inputVal);
35        });					
36    });
37});

###試したこと
「jquery select blur 複数回」などのキーワードで同事象が起こっていないか検索をしたり、
試行錯誤をしてみたものの、原因が分からずハマってしまい、今回投稿させて頂くに至りました。

###補足情報(言語/FW/ツール等のバージョンなど)
xampp7.0.13
(Apache:2.4.23、PHP:7.0.13)
fuelPHPを使用
smaetyテンプレートを使用

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

回答2件

$('td[class=status]').click(function(){}の中に$(this).children("select").focus().blur(function(){}があるので、クリックするたび（セレクトボックスを選択するクリックも含まれます）にイベントが増えるような気がします。

投稿2017/03/22 07:13