Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.02.2013, 14:28
Аспирант
Отправить личное сообщение для Torch`Ok Посмотреть профиль Найти все сообщения от Torch`Ok
 
Регистрация: 12.09.2012
Сообщений: 43

Запись свойств картинок в строку
Нужна помощь с передачей свойств картинок php скрипту...
Есть несколько картинок
<div id="img1" class="image"><img src="image1.png" /></div>
<div id="img2" class="image"><img src="image2.png" /></div>
<div id="img3" class="image"><img src="image3.png" /></div>
<div id="img4" class="image"><img src="image4.png" /></div>
<div id="img5" class="image"><img src="image5.png" /></div>

<a id="submit"><span></span></a>
			<form id="jsonform" action="merge.php" method="POST">
				<input id="jsondata" name="jsondata" value="" autocomplete="off">
			</form>

Их количество заранее не известно...
И код:
$('#submit').bind('click',function(){

  /*Тут нужен код перебора свойств css
типа           'id' 		: objid,
                'src' 		: objsrc,
                'width' 	: objwidth,
                'height' 	: objheight,
                'top' 	: objtop,
                'left' 	: objleft,
*/
                 
         var dataString  = JSON.stringify(data);
          $('#jsondata').val(dataString);
                });
            });


В конечном итоге должны получится строки для каждого дива примерно такие {"id":"img1","src":"images/image1.png","width":"940px","height":"1388px"}{"id ":"img2","src":"images/image2.png","width":"90px","height":"188px"} и т.д. они запишутся в input и отправятся на другую страничку...
Ответить с цитированием
  #2 (permalink)  
Старый 18.02.2013, 15:22
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

Torch`Ok,
и в чём проблема?
Ответить с цитированием
  #3 (permalink)  
Старый 18.02.2013, 15:36
Аспирант
Отправить личное сообщение для Torch`Ok Посмотреть профиль Найти все сообщения от Torch`Ok
 
Регистрация: 12.09.2012
Сообщений: 43

Проблема в js... Нужно чтоб он считал количество дивов с классом "image" и для каждого писал такую строку {"id":"img1","src":"images/image1.png","width":"940px","height":"1388px"}. Я не знаю как это реализовать
Ответить с цитированием
  #4 (permalink)  
Старый 18.02.2013, 15:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

Torch`Ok,
<!DOCTYPE HTML>

<html>

<head>
  <title></title>
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script type="text/javascript">
            $(function () {
               $('#submit').bind('click',function(e){
                e.preventDefault();
                var dataString = '';
                var divs = $('div.image');
                divs.each(function (index, self) {
                    var img = $(self).children('img') ;
                    var css =  img.css(['width', 'height','top','left'])
                    var id = $(self).attr("id");
                    var src = img.attr("src");
                    var data = {
                      'id' 		: id,
                'src' 		: src,
                'width' 	: css['width'],
                'height' 	: css['height'],
                'top' 	: css['top'],
                'left' 	: css['left']
                   }
                  dataString  += JSON.stringify(data);
                });
                alert(dataString); //для теста
                $('#jsondata').val(dataString);
            });
         });
        </script>
</head>

<body>
<div id="img1" class="image"><img src="image1.png" /></div>
<div id="img2" class="image"><img src="image2.png" /></div>
<div id="img3" class="image"><img src="image3.png" /></div>
<div id="img4" class="image"><img src="image4.png" /></div>
<div id="img5" class="image"><img src="image5.png" /></div>

<a id="submit"><span>click</span></a>
			<form id="jsonform" action="merge.php" method="POST">
				<input id="jsondata" name="jsondata" value="" autocomplete="off">
			</form>
</body>

</html>
Ответить с цитированием
  #5 (permalink)  
Старый 18.02.2013, 16:04
Аспирант
Отправить личное сообщение для Torch`Ok Посмотреть профиль Найти все сообщения от Torch`Ok
 
Регистрация: 12.09.2012
Сообщений: 43

Спасибо... Оч выручил..
Ответить с цитированием
  #6 (permalink)  
Старый 19.02.2013, 13:37
Аспирант
Отправить личное сообщение для Torch`Ok Посмотреть профиль Найти все сообщения от Torch`Ok
 
Регистрация: 12.09.2012
Сообщений: 43

А как добавить еще и для дивов с текстом???

<div id="img1" class="image"><img src="image1.png" /></div>
<div id="img2" class="image"><img src="image2.png" /></div>
<div id="img3" class="image"><img src="image3.png" /></div>
<div id="img4" class="image"><img src="image4.png" /></div>
<div id="img5" class="image"><img src="image5.png" /></div>

<div id="text1" class="text">text</div>
<div id="text2" class="text">text</div>
<div id="text3" class="text">text</div>
<div id="text4" class="text">text</div>
<div id="text5" class="text">text</div>

<script>
$(document).ready(function() {      
$('#submit').bind('click',function(e){
                e.preventDefault();

                var divs = $('div.image');
                 divs.each(function (index, self) {
                    var img = $(self).children('img') ;
                    var css =  img.css(['width', 'height','top','left'])
                    var id = $(self).attr("id");
                    var src = img.attr("src");
                    var data = {
                      'id' 		: id,
                'src' 		: src,
                'width' 	: css['width'],
                'height' 	: css['height'],
                'top' 	: css['top'],
                'left' 	: css['left']
                   }
                });
                
                var divstxt = $('div.text');
                divstxt.each(function (index, self) {
                    var css =  $(self).css(['width', 'height','top','left'])
                    var text = $(self).html();
                    var newdata = {
                    'width' 	: css['width'],
                'height' 	: css['height'],
                'top' 	: css['top'],
                'left' 	: css['left'],
                     'text'   : text
                   };
                }); 
               var data += newdata ;   
                var dataString  = JSON.stringify(data);
                $('#jsondata').val(dataString);
                $('#jsonform').submit();
            });
            });
</script>


Как правильно это совместить????? хелп
Ответить с цитированием
  #7 (permalink)  
Старый 19.02.2013, 14:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

Torch`Ok,
$(document).ready(function() {
$('#submit').bind('click',function(e){
                e.preventDefault();
                var dataString  = '';
                var divs = $('div.image');
                var data;
                 divs.each(function (index, self) {
                    var img = $(self).children('img') ;
                    var css =  img.css(['width', 'height','top','left'])
                    var id = $(self).attr("id");
                    var src = img.attr("src");
                    data = {
                      'id' 		: id,
                'src' 		: src,
                'width' 	: css['width'],
                'height' 	: css['height'],
                'top' 	: css['top'],
                'left' 	: css['left']
                   }
                 data = JSON.stringify(data); ;
                 dataString += data
                });

                var divstxt = $('div.text');
                divstxt.each(function (index, self) {
                    var css =  $(self).css(['width', 'height','top','left'])
                    var text = $(self).html();
                    data = {
                    'width' 	: css['width'],
                'height' 	: css['height'],
                'top' 	: css['top'],
                'left' 	: css['left'],
                     'text'   : text
                   };
                 data = JSON.stringify(data); ;
                 dataString += data

                });

                $('#jsondata').val(dataString);
                $('#jsonform').submit();
            });
            });
Ответить с цитированием
  #8 (permalink)  
Старый 19.02.2013, 15:49
Аспирант
Отправить личное сообщение для Torch`Ok Посмотреть профиль Найти все сообщения от Torch`Ok
 
Регистрация: 12.09.2012
Сообщений: 43

Все получилось... Спасибо
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
write to txt. В определенную строку!!! Maxfashko Общие вопросы Javascript 21 25.12.2012 02:12
Запись в конец текущей строки Maxfashko Общие вопросы Javascript 6 24.12.2012 05:05
Загрузчик картинок Livanderiaamarum Общие вопросы Javascript 1 15.01.2012 16:21
поочередное открытие картинок Dr.Livsi jQuery 10 31.07.2011 19:11
Изменение свойств картинок в документе Gekt0r Общие вопросы Javascript 10 14.08.2008 18:33