jqueryで入力可コンボボックスのリスト非表示操作

html5でjqueryを使って要素の操作をしています。
コンボボックスの操作です。リストに存在しない値でも入力可能としています。
マウスで入力欄にフォーカスしたら、それまで表示していたコンボボックスの
リストは非表示にし、コンボボックスで値をクリックしても値は入力欄に表示
して逆にリストは非表示にします。要するに普通の動作です。

この動作を実現してもらったのですがhtmlのscriptの記述がなかなか理解でき
ず消化不良となっています。提供者とも連絡がとれないためきくことができずに
います。

記述は抜粋して添付します。

以下質問です。
Combolistを.hideプロパティで非表示しているのは何となくわかります。
.cssプロパティで位置を指定しているのも何となくわかります。ですが
そのあとの.dataが続く部分がoffsetで要素の大きさouterHeightをみて
何かしてるのだろうとは思いますがdataとの兼ね合いがピンときません。
最後のvalが2回ほど記述されているのもどうしても理解ができません。
１つ１つのプロパティが一体何をしようとしているのかを教えていただけ
ないでしょうか。

何卒よろしくお願いいたします。
（htmlやjqueryに知識が明るくありません）

$('[data-Nyuryokufield]').on({
	'focus' : function(){
		$('[data-Combolist]').hide().css('left','0').css('top','0').data('Combolist',$(this).data('Nyuryokufield')).data('returnkey',$(this).attr('id'))
			.offset($(this).offset()).css('top',$(this).outerHeight() + $(this).offset().top).val($(this).val()).show();
	},
		'click' : function(){
			return false;
	}
});

--------------------------------------------------
Nyuryokufield…入力欄の要素名です。
Combolist…コンボボックスの要素名です。