Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Форум для новичков » В Помощь скриптодельцам!


В Помощь скриптодельцам!

Сообщений 1 страница 20 из 24

1

В Данной теме публикуем интересные фичи, могущие помочь скриптёрам в быстром создании некоторых модулей/секций.
Пример:

Удобная вставка многострочного текста/к примеру html

<script type="text/javascript">
function addContent (){ /*==123==;
  <style type="text/css">
  #pun .main{
     display:none;
   }
  </style>
  <script type="text/javascript">
    alert('Test Txt')
  <
\/script>
  <div id=world>
    Привет Мир!
  </div>

==123==;*/
} addContent = addContent.toString().split('==123==;')[1].replace(/<\\\/script/gim,'<'+'/script');
$(addContent).insertAfter('#pun-main'); //Используем вставку HTML через .insertAfter(),insertBefore(),.appendTo(),.prependTo();
</script>

Ps: В Подгружаемых скриптах, - в экранирование тега  <\/script> и последующего преобразование через .replace(/<\\\/script/gim,'<'+'/script'); - нет необходимости

Отредактировано Deff (Ср, 29 Янв 2014 00:45:36)

+2

2

Тест скорости исполняемого скрипта(Без Аякс подгрузки /или отработки по событию/

<script>var st_ = +new Date()</script>
<script type="text/javascript" src="http://st1.bbcorp.ru/js/uploadify/jquery.uploadify.v2.1.4.min.js"></script>
<script>alert(+new Date() - st_)</script><!-- Выводим время работы в ms -->

Отредактировано Deff (Сб, 18 Янв 2014 02:43:19)

+2

3

Чтение/Запись кукисов

<script type="text/javascript">
function setcOOkie(a,b,c) {if(c){var d = new Date();d.setTime(d.getTime()+c);}if(a && b) document.cookie = a+'='+ encodeURIComponent(b) +(c ? '; expires='+d.toUTCString() : '');else return false;}
function getcOOkie(a) {var b = new RegExp(a+'=([^;]){1,}');var c = b.exec(document.cookie);if(c) c = c[0].split('=');else return false;return c[1] ? decodeURIComponent(c[1]) : false;}


var str =  'Привет Мир!'
setcOOkie('hello_World',str,24*60*60*1000) //Параметры: Имя кука, данные, длительность хранения в ms
//Проверка наличия кука:
var a = getcOOkie('hello_World'); //Параметры: Имя кука, возвращает данные(если кука нет => false
if(a) alert(a);
</script>

Если записываем в кук цифровые данные, то необходимо преобразовать в строчный формат

var num = 0;
setcOOkie('number','' + num,1000);
//При чтении преобразуем назад в цифру:
var a = getcOOkie('number');
if(a)a = parseFloat(a);


Стирание Кука: - Записываем true в данные и отрицательное число в пункт время

setcOOkie('foo',true,-1000);

Отредактировано Deff (Сб, 18 Янв 2014 02:47:55)

+1

4

Другой способ отслеживания времени выполнения скрипта (через консоль браузера):

<script>
console.time("MyScript time");
// сюда скрипт без тегов <script>
console.timeEnd("MyScript time");
</script>

В консоли будет что-то типа

MyScript time: 2ms

Подробнее об отладке яваскрипта через консоль - http://habrahabr.ru/post/114483/

Отредактировано sadhaka (Вс, 19 Янв 2014 12:11:01)

+1

5

Чтение/Запись на localStorage

В Отличие от кукисов запись на localStorage позволяет сохранить до 5 мегабайт строковых данных на доменное имя( кукисы же, - общий объем максимум 4-20кб/домен, меньшая цифра для ИЕ6-8)
Ограничение для  localStorage В ИЕ /работает, начиная с Ие8 и выше/

Методы:

if(window.localStorage){... //Проверка наличия поддержкм Local storage в Браузере
localStorage.setItem(name,value); //Записываем строчные Данные
localStorage.getItem(name);    //Читаем строчные Данные
localStorage.removeItem(name); //удалит элемент из хранилища
localStorage.clear();    //удалит все элементы в хранилище

Пример использования: (Записываем и считываем строчные данные)

<script type="text/javascript">
var value = 'localStorage позволяет сохранить до 5 мегабайт строковых  данных!';
var name ="Моя Строка";
if(window.localStorage){
localStorage.setItem(name,value);
var getvalue = localStorage.getItem("Моя Строка");
if(getvalue)alert(getvalue)
}
</script>

Отредактировано Deff (Сб, 25 Янв 2014 22:54:36)

+1

6

//может кому-то пригодится

Получение данных (параметров GET-запроса) из URL

Есть такой URL

Код:
http://forum.mybb.ru/viewtopic.php?id=33659&p=2#p817515

надо на выходе получить

id=33659
p=2

function getUrlDate() {
        var param = {};
        var getURL = location.href.replace(/[?&]+([^=&]+)=([^&#]*)/gi, function(t,key,value) {
            param[key] = value;
        });
    return param;
    }

Вызываем функцию и получаем значение ключа (параметра)

var tID = getUrlDate()["id"]; //вернет 33659
var page = getUrlDate()["p"]; //вернет 2

Отредактировано sadhaka (Сб, 25 Янв 2014 10:58:40)

+2

7

sadhaka написал(а):

//может кому-то пригодится
Получение данных (параметров GET-запроса) из URL

У меня вопрос: можно ли сделать аналогично, но для ссылки типа: <a href="http://forum.mybb.ru/profile.php?id=30813" rel="nofollow">Профиль<span class="acchide">&nbsp;sadhaka</span></a> ?
К примеру нужно вычленить ид ссылки профиля каждого пользователя в данной теме - как это можно сделать?

0

8

kolobdur74 написал(а):

К примеру нужно вычленить ид ссылки профиля каждого пользователя в данной теме - как это можно сделать?

:glasses: Не оч понятно
можно выделить id для конкретного сообщения или массив id для страницы топика
Рыть всех пользователей по всем страницам темы занятие не оч благодарное (но в принципе  можно сделать)
для конкретного сообщения

function getUsNickID(post) {
    var Nick = "Гость",id = 0; //Гость;
    var a = post.find('.pa-author a');
    if(a.length){Nick = a.html();
        var a1 = post.find('.post-links .pl-email a[href*="profile.php?"]');
        if(!a1.length) a1 = a;
        id = a1.attr('href').split('profile.php?id=')[1];
    }  return [Nick,id];
}
//Читаем все id страницы
var pageProvileID = {}
  $('.post').each(function(){
     alert(getUsNickID($(this)) );
  });

Отредактировано Deff (Сб, 5 Апр 2014 17:03:16)

0

9

Deff написал(а):

var id = post.find('.post-links .pl-email:first a').attr('href')

Единственно, что это не будет работать у гостей

kolobdur74 написал(а):

К примеру нужно вычленить ид ссылки

вычленить id из ссылки - не проблема, проблема получить ссылку

0

10

Deff написал(а):

можно выделить id для конкретного сообщения или массив id для страницы топика

Мне нужно ИД конкретного пользователя  конкретного сообщения, по сути нужен ИД пользователя данного сообщения..

sadhaka написал(а):

вычленить id из ссылки - не проблема, проблема получить ссылку

А ссылка на Профиль пользователя: <a href="http://forum.mybb.ru/profile.php?id=30813" rel="nofollow">Профиль<span class="acchide">&nbsp;sadhaka</span></a> ?

0

11

kolobdur74 написал(а):

Мне нужно ИД конкретного пользователя  конкретного сообщения, по сути нужен ИД пользователя данного сообщения..

я бы сделал так:

var prof = $('div#p833495 li.pl-email a').attr('href');
var profID = prof.slice(prof.indexOf('id=')+3);
//alert(profID);

где выделенное жёлтым id конкретного сообщения, а переменная profID соответствует id автора данного сообщения
id сообщения взял бы из ссылки нужного поста
http://sb.uploads.ru/t/DO3vw.png

0

12

Экспорт данных с форума (json)

http://onff.ru/export.php?forum=domain.tld&max=15

Красным - ваш домен.
Синим - количество выводимых заголовков.

Пример:
(тык скрин)

Код:
$.getJSON('http://onff.ru/export.php?forum=celans.ru&max=15', function(data) {
  var row = '';
  for (d in data) {
    var title = data[d].title;
    var link = data[d].link;
    var author = data[d].author;
    var date = data[d].date;
    var time = data[d].time;
    row += '<tr><td colspan="2">'+(parseInt(d)+1)+'. <a href="'+link+'" target="_blank">'+title+'</a></td></tr><tr><td>'+author+'</td><td>'+date+' в '+time+'</td></tr>';
  } $('#news').html(row);
});

Туда, где нужен вывод тем:

<table id="news"></table>

Отредактировано Fover (Пт, 7 Ноя 2014 13:55:45)

+3

13

Адрес экспорта изменен на http://onff.ru/export.php

0

14

Deff написал(а):

Добавка псевдокнопок "Отправить и "Посмотреть" /подменяющих реальные/
в форму ответа, для обработки контента textarea, перед отправкой
(к примеру вставка своих доп тегов или отметки в сообщение)
В HTML верх или низ

    <!-- Предобработка формы перед отправкой -->
    <script type="text/javascript">
    $(document).ready(function(){
      $('#post').find('input[type="submit"]').each(function(){
        $(this).hide().clone().addClass('submit-analog').attr('type','button')
         .removeAttr('name').show().insertAfter(this);
      });
      $('#post').find('.submit-analog').click(function(){
        //==================
        //ТУТ ВАШИ КОДЫ ОБРАБОТКИ ПЕРЕД ОТПРАВКОЙ!
        //==================
        var form = $('#post')[0];submit = $(this).prev();
        if(process_form(form))setTimeout(function(){submit.click();},100);
      });
    });
    </script>

Отредактировано Deff (Ср, 29 Янв 2014 00:44:03)

Спасибо за скрипт, очень удобно, пригодилось. Но в некоторых браузерах (в частности, IE 9 например) кнопки подменяются как-то некорректно, и пропадают вовсе. С этим можно что-то поделать?

0

15

mux, в ИЕ запрещено изменение формы, ток полная перезапись, пробуйте так:

<!-- Предобработка формы перед отправкой -->
    <script type="text/javascript">
    $(document).ready(function(){
      var PST=$('#post').clone(true); PST.find('script').remove();
      PST.find('input[type="submit"]').each(function(){
        $(this).hide().clone().addClass('submit-analog').attr('type','button')
         .removeAttr('name').show().insertAfter(this);
      }); PST.replaceAll('#post',document.body);
      $('#post').find('.submit-analog').click(function(){
        //==================
        //ТУТ ВАШИ КОДЫ ОБРАБОТКИ ПЕРЕД ОТПРАВКОЙ!
        //==================
        var form = $('#post')[0];submit = $(this).prev();
        if(process_form(form))setTimeout(function(){submit.click();},100);
      });
    });
    </script>

0

16

Упаковщик символов кириллицы в Base-64 (c коротким выходным кодом)
(ну или иных, но в utf-8)

Можете сравнить длину кода при упаковке через encodeURIComponent()

<script type="text/javascript">
   function unPack(a) {
      return decodeURIComponent(escape(atob(a.replace(/[^A-Za-z0-9\/\=\+]/g,""))));
   }
   function Pack(a) {
      return btoa(unescape(encodeURIComponent(a)));
   }
alert(Pack('»В Помощь скриптодельцам! '));
alert(unPack(Pack('» В Помощь скриптодельцам! ')))
</script>

/Не работает в ИЕ (имхо, вплоть до 9-10 версии)/

Удобен при шифровании строки или отправки поисковых запросов Аяксом(строка короткая)

0

17

http://mobiletest.me/

+1

18

Получаем аватары по массиву UserID

function insertКудато(obj){ //Это типо функция вставки Аввы(пока просто alert())
  $.each(obj, function(usrID) {
    alert(usrID+':'+this)
  });
}
function getAvatar(arrID){
  var obj={}
  $.post("/api.php?", { method: "users.get", user_id: arrID.toString(), fields: "avatar" }, function( data ) {
    if ( data.error ) return false;
    else if ( data.response ){
                                     $.each(data.response.users, function(i) {
                                        obj[arrID[i]]=this.avatar
                                     });
                                     insertКудато(obj)
                                  }
  }, "json" );
}
/*Запрашиваем Аввы*/
getAvatar([2,32995]) //Массив UserID

+1

19

Часто бывает упустив в длинном коде поставить var перед переменной, переменная вылезает в Global и либо портиться сама, либо портит чужие скрипты...
И потом не понимаешь, нормальный код, вроде должен работать, а совместно(или просто сам по себе) - глючит. Типично сам по себе, когда переменная из одной функции вылезает в область видимости родителя или выше по списку.(Можно тестировать и отдельные функции, ставя их в теги <script> (правдо надо запускать, можно обернуть всё в анонимную функцию, чтобы запускающий код не добавлял в  Global )

Тестируем имена переменных, внесённых Нашим скриптом в область глобальной видимости

<!-- Тестируем имена переменных, внесённых Нашим скриптом в область глобальной видимости! -->
<script type="text/javascript">
$.a = JSON.parse(JSON.stringify(Object.keys(window)))
</script>

<!-- !!Тестируемый скрипт (Пример) -->
<script type="text/javascript">
//Тестируемый скрипт!!
var asdsafsd = 1;
var tyrtut = 4;
</script>

<!--//Концовка тестирующего скрипта -->
<script type="text/javascript">
$.b = JSON.parse(JSON.stringify(Object.keys(window)));
(function() {var obj={};
for(var i=0;i<window['$']['b'].length;i++)obj[window['$']['b'][i]]=1;
for(var i=0;i<window['$']['a'].length;i++) delete obj[window['$']['a'][i]];
alert('Переменные вносимые тестируемым скриптом в Global:\n'+JSON.parse(JSON.stringify(Object.keys(obj))).join(',\n'));
}());
</script>

+1

20

Часто бывает нужно работать с элементами, которые вставляются на страницу после ее загрузки (например, подгружаемые аякс запросом через многосложный чужой скрипт),
Этот скрипт облегчает действия с динамически вставляемым контентом:

Отлавливаем динамически вставляемые элементы на странице

<script type="text/javascript">
$.catch = function(a,f){$(function(){var t,i=0;function s(){i++;if(i>120)return;t=setTimeout(function(){if(!$(a).length){s();return};f()},100);}s();});}
</script>


$.catch('селектор', обработчик)
Селектор - jQuery-селектор элемента, появление которого тестируется.
Обработчик - пользовательская функция, вызываемая после появления тестируемого элемента.


//пример: отслеживаем появление блока подфорумов на странице форума, вставляемого скриптом Подфорумы "не скриптом", новая версия

<script type="text/javascript">
$.catch = function(a,f){$(function(){var t,i=0;function s(){i++;if(i>120)return;t=setTimeout(function(){if(!$(a).length){s();return};f()},100);}s();});}

if($('#pun-viewforum').length) $.catch('#f-subforums', function() {
  alert('Подфорумы вставлены! Количество: ' + $('#f-subforums tbody tr').length);
}
);

</script>

+2


Вы здесь » Единый форум поддержки » Форум для новичков » В Помощь скриптодельцам!