Архив метки: javascript

Установка курсора в позицию поля input или textarea на JavaScript

Кроссплатформенное решение, не требующее Jquery:

function getCaretPosition(ctrl) {
    if (document.selection) {
        ctrl.focus();
        var range = document.selection.createRange();
        var rangelen = range.text.length;
        range.moveStart('character', -ctrl.value.length);
        var start = range.text.length - rangelen;
        return {
            'start': start,
            'end': start + rangelen
        };
    } else if (ctrl.selectionStart || ctrl.selectionStart == '0') {
        return {
            'start': ctrl.selectionStart,
            'end': ctrl.selectionEnd
        };
    } else {
        return {
            'start': 0,
            'end': 0
        };
    }
}


function setCaretPosition(ctrl, start, end) {
    if (ctrl.setSelectionRange) {
        ctrl.focus();
        ctrl.setSelectionRange(start, end);
    } else if (ctrl.createTextRange) {
        var range = ctrl.createTextRange();
        range.collapse(true);
        range.moveEnd('character', end);
        range.moveStart('character', start);
        range.select();
    }
};    

Использование:

//прочитаем позицию с выделеним
outpz = getCaretPosition(document.getElementById('summpayme'));
//установим позицию с выделением
setCaretPosition(document.getElementById('summpayme'),outpz.start, outpz.end);

JavaScript проверка попадания в рабочее время

Например, нам нужно, чтобы какаято часть страницы работала исключительно в рабочее время. Для этого реализуем проверку «попадания» в рабочее время.

<script>
//зададим рабочее время
worktime=[]
worktime[0]={start:10,end:23}; //воскресенье с 10 до 23
worktime[6]={start:10,end:23}; //суббота с 10 до 23
worktime[4]={start:10,end:23}; //четверг с 10 до 23
    
function IsWorkTime(worktime){
  var dt=new Date();
  var w=dt.getDay();
  if (typeof(worktime[w])!="undefined"){
      if (dt.getHours()>=worktime[w].start&dt.getHours()<=worktime[w].end){
	console.log("работаем!");
	return true;  	  	  
      } else {
	console.log("в это время не работаем!");
	return false;  	  
      };      
  } else {
    console.log("в этот день недели не работаем!");
    return false;  
  };
};
alert(IsWorkTime(worktime));
</script>   

Динамическая загрузка скриптов на JavaScript

В том случае если необходимо динамически подгрузить на страницу какие-то скрипты, возможно использовать например прообраз следующего кода:

window.onload=function(){
    if (typeof jQuery == 'undefined') {    
	dhtmlLoadScript("https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js");
    };
	//проверяем, а подгрузился ли juery?
	var timerId = setInterval(function() {
	    if (typeof jQuery == 'undefined'){
		console.log("--еще не догрузился jquery..ждем..");
	    } else {
		dhtmlLoadScript("http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js");		
		console.log("--вроде jquery загрузился, гружу jquery-ui..");		
		clearInterval(timerId);
		var timerId2 = setInterval(function() {		
		    if (typeof $.ui == 'undefined'){
			console.log("--еще не догрузился jquery-ui..ждем..");
		    } else {
			clearInterval(timerId2);
			console.log("--вроде jquery-ui загрузился, инициализирую чат..");					
			mainchat();
		    };		    
		},1000);		
	    };	    
	}, 1000);	
	
};
function dhtmlLoadScript(url){
   var e = document.createElement("script");
   e.src = url;
   e.type="text/javascript";
   document.getElementsByTagName("head")[0].appendChild(e); 
}

в данном случае в целях кроссбраузерности, используется проверка по таймеру, загрузился код или нет, ибо в файрефоксе идет последовательная загрузка кода, а в хроме паралельная. В связи с чем, может возникать ситуация дальнейшего выполнения кода, при еще не подгруженных скриптах.

Добавление текста в буфер обмена на JavaScript

Необходимо скопировать в буфер обмена некий текст. Задача осложнаяется тем, что браузеры позволяют скопировать в буфер, в целях безопасности только программно выделенный текст. Т.е. не получится скопировать в буфер любой текст, а возможно только тот, который находится в тегах типа input, textarea и т.п.

Решение:

Работать будет только в сборках браузеров старше 2015года!

  1. Выводим на странице скрытый текстовый блок
    <textarea style="display:none;" id="url_to_copy"></textarea>
  2. По нажатию кнопки «Скопировать», показываем этот блок. К сожалению иначе выделение не работает, приходится показывать.
  3. Заносим в этот блок текст необходимый для копирования в буфер
  4. Программно выделяем текст
  5. Убираем с глаз долой этот текстовый блок.

Как показывает практика при умелом «прятаньи» этого блока в тексте страницы, пользователь ничего не замечает.

Пример кода:

           
$("#url_to_copy" ).show();
url="https://nocfcefertelesererfe.ru/index.php?content_page=lanbilling/sos&billing_id="+$("#blibase").val()+"&agrm_id="+id;            
$("#url_to_copy").val(url);           
url_to_copy.select();
document.execCommand("copy");
$("#url_to_copy").attr("display:none");