Chọn tất cả văn bản trong phần tử khi nhấp chuột (JavaScript HOẶC jQuery)

Advertisement

Select All Text In Element on Click (JavaScript OR jQuery)

Để chọn tất cả văn bản bên trong một phần tử, chẳng hạn như DIV, chúng ta chỉ cần sử dụng phương thức JavaScript document.createRange () để tạo một phạm vi và hơn là sử dụng Range.selectNodeContents () chúng ta có thể đặt phạm vi nút (bắt đầu và kết thúc), sau đó sử dụng lựa chọn .addRange () để chọn phạm vi của phần tử.
JavaScript.

Mã JavaScript này thực hiện chức năng chính của nó là chọn tất cả văn bản bên trong một phần tử, nhưng chúng ta không muốn nó khó chịu khi chọn mọi thứ mà phần tử mọi lúc được nhấp. Chúng ta cũng muốn người dùng có thể chọn một phần văn bản bất cứ khi nào cần.

function selectText(id){
	var sel, range;
	var el = document.getElementById(id); //get element id
	if (window.getSelection && document.createRange) { //Browser compatibility
	  sel = window.getSelection();
	  if(sel.toString() == ''){ //no text selection
		 window.setTimeout(function(){
			range = document.createRange(); //range object
			range.selectNodeContents(el); //sets Range
			sel.removeAllRanges(); //remove all ranges from selection
			sel.addRange(range);//add Range to a Selection.
		},1);
	  }
	}else if (document.selection) { //older ie
		sel = document.selection.createRange();
		if(sel.text == ''){ //no text selection
			range = document.body.createTextRange();//Creates TextRange object
			range.moveToElementText(el);//sets Range
			range.select(); //make selection.
		}
	}
}

jQuery
Nếu bạn muốn sử dụng nó làm mã jQuery, chỉ cần đặt mã bên trong phương thức sự kiện “mouseup” của jQuery , đại loại như sau:

$("#elementID").on('mouseup', function() { 
	var sel, range;
	var el = $(this)[0];
	if (window.getSelection && document.createRange) { //Browser compatibility
	  sel = window.getSelection();
	  if(sel.toString() == ''){ //no text selection
		 window.setTimeout(function(){
			range = document.createRange(); //range object
			range.selectNodeContents(el); //sets Range
			sel.removeAllRanges(); //remove all ranges from selection
			sel.addRange(range);//add Range to a Selection.
		},1);
	  }
	}else if (document.selection) { //older ie
		sel = document.selection.createRange();
		if(sel.text == ''){ //no text selection
			range = document.body.createTextRange();//Creates TextRange object
			range.moveToElementText(el);//sets Range
			range.select(); //make selection.
		}
	}
});

Advertisement

NotePad24h tạo ghi chú miễn phí và lưu trữ vĩnh viễn

Comment của bạn

avatar
  Theo Dõi  
Thông báo