Давненько я ничего не писал. А все потому что времени совершенно ни на что не хватает, сейчас делаю новый проект. И так уж получилось что проект я решил писать с обширным использованием AJAX, и ничего удобнее чем фреймворк jquery я не нашел. На то есть 2 причины, 1 - широчайшее распространение, 2 - обилие плагинов и библиотек.
В проекте были нужны Drag&Drop окошки, писать самому было лень, да и время всегда против меня, поэтому решил сначала поискать готовые библиотеки. И, таки, нашел http://interface.eyecon.ro/ Офигительный набор интерфейсов. Весь кайф в том что можно качать только то, что тебе нужно. Поэтому я с удовольствием скачал iutils и idrag.
Для того что бы элемент можно было таскать достаточно в стилях прописать
,подключить оба скрипта + jquery... правда потом ещё стало понятно, что нужны так же jquery.dimensions и jquery.tooltip.min
<script type="text/javascript" src="scripts/jquery-1.4.3.js"></script>
<script type="text/javascript" src="scripts/jquery.dimensions.js"></script>
<script type="text/javascript" src="scripts/jquery.tooltip.min.js"></script><script type="text/javascript" src="scripts/iutil.js"></script>
<script type="text/javascript" src="scripts/idrag.js"></script>
А дальше - просто по селектору находим объект и применяем к нему Draggable
$("#window").Draggable(
{
zIndex: 10000, //положение слоя
ghosting: false, //делать ли на время перетаскивания полупрозрачную копию
handle: ".winheader", //селектор элемента, за который будет таскаться #window
containment:"parent", // границы перетаскивания; по умолчанию их нет.
opacity: 0.5 // прозрачность на момент перетаскивания
}
);
Красота -, я вам скажу.
Вообще в jQuery меня особенно прет с селекторов, Ave тем кто допер до такой реализации обращения к DOM.
Как же было приятно обнаружить, что для того что бы, к примеру, сделать границы у всех картинок в div'e с id=mydiv достаточно написать
$("#mydiv > img").css("border","1px solid black");
Отправка же данных POST'ом осуществляется простейшей функцией
$.post('target.php',"var=value"
,callback);
Если кто-не понит, то напомню, что для того, чтобы отправлять данные в "голом" JS нужно было накатать что-то вроде вот этого:
var req = new ActiveXObject("Microsoft.XMLHTTP"); (для IE)
var req = new XMLHttpRequest(); (Для всего остального)
var req;
function loadXMLDoc(url) {
// branch for native XMLHttpRequest object
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send(null);
// branch for IE/Windows ActiveX version
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send();
}
}
}
function checkName(input, response)
{
if (response != ''){
// Response mode
message = document.getElementById('nameCheckFailed');
if (response == '1'){
message.className = 'error';
}else{
message.className = 'hidden';
}
}else{
// Input mode
url = 'http://localhost/xml/checkUserName.php?q=' \\
+ input;
loadXMLDoc(url);
}
}
В общем вы понимаете о чем я...
А в остальном, jQuery дает огромные возможности для тех кто хотел писать интересные интерфейсы и интерактивные ajax-приложения для веб. Он очень полезен для тех, кто не хотел заморачиваться в JS с получением объектов из DOM.