Показать сообщение отдельно
  #2 (permalink)  
Старый 18.02.2010, 18:55
Интересующийся
Отправить личное сообщение для cooli0 Посмотреть профиль Найти все сообщения от cooli0
 
Регистрация: 25.01.2010
Сообщений: 20

Я бы генерировал JS на стороне сервера, в виде литеральной нотации, и вставлял бы этот кусок в HTML. Результат - когда пользователь загружает страницу, - сразу инициализировать объект с нужными путяым к фотографиям. Дабы между ссылками и фотографиями была связь - присвоить idишники ссылкам - и соответсвенно ваш сгенерированный объейт выглядел {<id1>: '<img_src1>', <id2>: '<img_src2>', ...etc... }

То есть:

<script type="text/javascript">
MYObject.init({id1: 'http://../img1.png', id2: 'http://../img2.png' });
</script>


На кажую ссылку повестиь event onclick (именно Event, а не onclick аттрибут). Общий код (очень приблизительный):

// обезопасим внешний контекст
(function() {

  var MYObject = {

    images: undefined,

    image_html: "\
         <div>\
            <img src="{img_src}">\
            <input type="checkbox">\
         </div>\
    ",

    init: function(obj) {
       this.images = obj;
       this.applyEvents();
    },

    _applyEvents: function() {
       this._setAnchorEvents();
       // ...другие евенты....
    },

    _setAnchorEvents: function() {
       // ищем нужные тэги a и ставим event onclick на функцию _showImage
    },

    _showImage: function(event) {
       // получить target элемент - ваш тэг a
       var id = targetEl.id;
       var html = this._renderImageHtml(id);
       document.getElementById('КУДА ВСТАВИТЬ КОНТЕНТ') = html;
    },
    
    _renderImageHtml: function(id) {
       return this.image_html.replace(
           "{img_src}", this.images[id]
       );
    }

  };

  // сделаем MYObject доступным из вне
  window.MYObject = MYObject;

})();

Последний раз редактировалось cooli0, 18.02.2010 в 19:00.
Ответить с цитированием