SQLの窓 イラストAC フリー素材

2019年08月14日

IE11 + jQuery で、select( リスト)をタブルクリックした時に OPTION 要素の処理を行うコード

Google Chrome では、OPTION 要素に直接 dblclick イベントを作成できましたが、IE11 では無視されたので以下のようにして実装しました

select でイベントを作成して、その後選択されている場所が対象なので $(this).find(":selected") で参照します

※ デモページ
$(function(){

	// **************************************
	// 対象追加
	// **************************************
	$("#target").on("dblclick", function(){

		var target = $(this).val();

		$("#code option").each(function( idx ){

			if ( $(this).val() == target ) {
				alert( "この対象は既にセットされています" );
				target = null;
				return;
			}

		});

		if ( target != null ) {
			$("<option></option>")
				.val( target )
				.text( $(this).find(":selected").text() )
				.appendTo("#code")
			;
		}

	});

	// **************************************
	// メンバ削除
	// **************************************
	$("#code").on("dblclick", function(event){

		console.log("dblclick");

		$(this).find(":selected").remove();

	});

});



posted by at 2019-08-14 19:48 | IE | このブログの読者になる | 更新情報をチェックする