Архивы javascript - Страница 8 из 10

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

22.06.2016 Павел Грибов WEB

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

Решение:

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

Выводим на странице скрытый текстовый блок

<textarea style="display:none;" id="url_to_copy"></textarea>

1

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

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

Пример кода:

           
$("#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");

$("#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");

Оставить комментарий clipboard, javascript, буфер обмена

Синхронная загрузка ajax при использовании jQuery

18.05.2016 Павел Грибов WEB

Задача: строго последоватально подгрузить код на страницу.

Решение:

  $.ajax({
        url: "controller/server/lanbilling/listgrp.php?blibaseid="+blibaseid,        
        async: false                
    }).done(function(data) {	    
	    $("#grpd").html(data);            	
    });

$.ajax({

url: "controller/server/lanbilling/listgrp.php?blibaseid="+blibaseid,

async: false

}).done(function(data) {

$("#grpd").html(data);

});

Конечно это считается не правильным подходом, т.к. в целом замедляет загрузку страницы. Однако в некоторых случая это просто необходимо. Например, когда нужно получить некое значение из загружаемого участка, а участок не понятно, уже подгрузился или еще нет.

Оставить комментарий ajax, async, javascript, sync, синхронная загрузка, синхронное выполнение

Берём данные мониторинга с сервера Астры через сокеты

09.02.2016 Павел Грибов WEB

Задача: вытянуть на веб страницу данные по текущему битрейту каналов на карте с мониторинга на сервере астры.

Удачно сложилось, что сам «штатный» мониторинг сервера обменивается между своим ядром и веб страницей через соединение websocets. Это можно использовать, написав свой сервис «цепляющийся» к астре и получающий данные. » Читать далее

Оставить комментарий astra, javascript, websocets, WebSocket

Библиотека для работы с графикой на JavaScript

28.07.2015 Павел Грибов WEB

Последнее время активно работаю с библиотекой fabric.js, для работы с графикой на JavaScript, а именно делаю «редактор муфт»:

Библиотека позволяет на холсте canvas работать с графикой как с объектами: выделять, изменять, назначать обработчики событий (выделение, клик, перемещение и т.п.) для каждого объекта. Ну и еще много всего. В то-же время она достаточно проста в освоении.

Однако приведу несколько моментов, на которые пришлось потратить время, что-бы разобраться:

1) Перебор всех объектов в canvas:

         canvas.forEachObject(function(obj) {    
          };

1 2	canvas.forEachObject(function(obj) { };

2) Для очистки canvas от всех объектов:

canvas.clear();

1	canvas.clear();

3) Закраска объекта градиентом:

              var rect = new fabric.Rect({left: 20,top: 0,fill: 'yellow',width: wx-40,height: steph,selectable:false,shadow: 'green 2px 2px 2px'});
                        rect.setGradient('fill', {x1: 0,y1: 0,x2: 0,y2:  rect.height,colorStops: {1: '#000',0: '#fff'}});              
                        canvas.add(rect);

var rect = new fabric.Rect({left: 20,top: 0,fill: 'yellow',width: wx-40,height: steph,selectable:false,shadow: 'green 2px 2px 2px'});

rect.setGradient('fill', {x1: 0,y1: 0,x2: 0,y2: rect.height,colorStops: {1: '#000',0: '#fff'}});

canvas.add(rect);

4) Назначение событий:

canvas.on('object:selected', function(e) {
    p = e.target;
// в p сейчас, обьект по которому "щелкнули"
 });

canvas.on('object:selected', function(e) {

p = e.target;

// в p сейчас, обьект по которому "щелкнули"

});

Оставить комментарий fabric.js, javascript

Курсор в конец textarea

17.06.2015 Павел Грибов WEB

Например у вас в textarea длинный текст. Вам необходимо отобразить конце скролла.

<?php
echo "<textarea name='ttx' id='ttx' class='span12' rows=20>";
echo "$code";
echo "</textarea>";
?>

<script>
jQuery.fn.putCursorAtEnd = function() {
  return this.each(function() {
    $(this).focus()
    if (this.setSelectionRange) {
      var len = $(this).val().length * 2;
      this.setSelectionRange(len, len);   
    } else {
      $(this).val($(this).val());      
    }
    this.scrollTop = 999999;
  });

};
    $("#ttx").putCursorAtEnd(); 
 </script>

<?php

echo "<textarea name='ttx' id='ttx' class='span12' rows=20>";

echo "$code";

echo "</textarea>";

jQuery.fn.putCursorAtEnd = function() {

return this.each(function() {

$(this).focus()

if (this.setSelectionRange) {

var len = $(this).val().length * 2;

this.setSelectionRange(len, len);

} else {

$(this).val($(this).val());

}

this.scrollTop = 999999;

});

};

$("#ttx").putCursorAtEnd();

</script>

Оставить комментарий javascript, Jquery, textarea, в конец поля

« 1 … 6 7 8 9 10 »

Пн	Вт	Ср	Чт	Пт	Сб	Вс
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30