Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Перенос div с одного места в другое (https://javascript.ru/forum/misc/62696-perenos-div-s-odnogo-mesta-v-drugoe.html)

PonyS 24.04.2016 11:12
Перенос div с одного места в другое
 
Здравствуйте! Прошу вашей помощи...Написал маленький скрипт на jquery переноса div с одного места в другое, а именно:

<script type="text/javascript">
			
		jQuery(document).ready(function(){

jQuery("#cs1").appendTo("#cs2");
jQuery("#content").css('display','none');

		});
</script>


Все работает, но на моб. устройствах не читается почему-то функций appendTo и css, на ПК работает отлично, и теперь не знаю чем заменить этот скрипт чтобы работал на всех устройствах, подскажите пожалуйста, опыта с js немного, пока учусь, заранее спасибо!

aklis 25.04.2016 11:03
Нафига учить фреймворк не зная языка на котором он написан? Чето я вообще этого не пойму.
function func(){
  var elem1 =document.getElementById("cs1"); 
  var elem2 = document.getElementById("cs2");
  var content = document.getElementById("content");
  elem1.appendChild(elem2);
  content.style.display = "none";
}
func();

Почитал документацию по jQuery
Насколько я понял - это будет работать так как ты задумал. Если конечно у тебя не куча элементов с одинаковыми айди на странице.

PonyS 25.04.2016 15:18
Цитата:
Сообщение от aklis (Сообщение 414907)
Нафига учить фреймворк не зная языка на котором он написан? Чето я вообще этого не пойму.
function func(){
  var elem1 =document.getElementById("cs1"); 
  var elem2 = document.getElementById("cs2");
  var content = document.getElementById("content");
  elem1.appendChild(elem2);
  content.style.display = "none";
}
func();

Почитал документацию по jQuery
Насколько я понял - это будет работать так как ты задумал. Если конечно у тебя не куча элементов с одинаковыми айди на странице.
Спасибо, скрытие id content работает, но перемещение блока сs1 к cs2 почему-то не работает...

Dilettante_Pro 25.04.2016 16:06
PonyS,
на смартфоне самсунг в хроме все прекрасно работает
<!DOCTYPE html>
<html>
<head>
    <title>Untitled Page</title>
    <style>
      #cs1
      { border: 1px solid black;
        width:30%;
          }
       #cs2
      { border: 2px solid red;
        width:30%;
          }   
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function () {
            jQuery("#cs1").appendTo("#cs2");
            jQuery("#content").css('display', 'none');
        });
</script>
</head>
<body>
  <div id="cs1">CS1</div>
  <div id="cs2">CS2</div>
  <div id="content">CONTENT</div>
</body>
</html>

aklis 25.04.2016 17:17
Все ж работает. Элементы с одинаковым айди есть?
<!DOCTYPE HTML>
<html>

<head>
<meta charset="utf-8">
  <style>

      #cs1
      { border: 1px solid black;
        width:30%;
          }
       #cs2
      { border: 2px solid red;
        width:30%;
          }  
    </style>
</head>

<body>
  <div id="cs1">CS1</div>
  <div id="cs2">CS2</div>
  <div id="content">CONTENT</div>
  
  <input type="button" onclick="func()" value="Тык">
  <script> 
  function func(){
  var elem1 =document.getElementById("cs1");
  var elem2 = document.getElementById("cs2");
  var content = document.getElementById("content");
  elem1.appendChild(elem2);
  content.style.display = "none";
}

  </script>
</body>
</html>

PonyS 25.04.2016 18:36
Цитата:
Сообщение от aklis (Сообщение 414951)
Все ж работает. Элементы с одинаковым айди есть?
<!DOCTYPE HTML>
<html>

<head>
<meta charset="utf-8">
  <style>

      #cs1
      { border: 1px solid black;
        width:30%;
          }
       #cs2
      { border: 2px solid red;
        width:30%;
          }  
    </style>
</head>

<body>
  <div id="cs1">CS1</div>
  <div id="cs2">CS2</div>
  <div id="content">CONTENT</div>
  
  <input type="button" onclick="func()" value="Тык">
  <script> 
  function func(){
  var elem1 =document.getElementById("cs1");
  var elem2 = document.getElementById("cs2");
  var content = document.getElementById("content");
  elem1.appendChild(elem2);
  content.style.display = "none";
}

  </script>
</body>
</html>
По идее cs1 должен ставать на место cs2 как в appendTO(jquery), но что-то не так...

Dilettante_Pro 25.04.2016 18:46
PonyS,
Цитата:
Сообщение от PonyS
По идее cs1 должен ставать на место cs2 как в appendTO(jquery), но что-то не так...
Что в jQuery (пост 4) что на javaScript (пост 5) cs1 встает внутрь cs2
http://jquery.page2page.ru/index.php...82%D0%BE%D0%B2
https://learn.javascript.ru/modifying-document

PonyS 25.04.2016 19:16
Цитата:
Сообщение от Dilettante_Pro (Сообщение 414958)
PonyS,

Что в jQuery (пост 4) что на javaScript (пост 5) cs1 встает внутрь cs2
http://jquery.page2page.ru/index.php...82%D0%BE%D0%B2
https://learn.javascript.ru/modifying-document
Дело в том, что с функцией appendTo(jquery) у меня div id cs1 встает автоматически внутрь div id cs2, а с этой js функцией appendChild у меня работает только display none(content), а перемещение div не работает

Dilettante_Pro 25.04.2016 20:39
PonyS,
Ну так используйте вариант с jquery, хотя у меня на смартфоне и вариант aklis нормально работает


Часовой пояс GMT +3, время: 06:17.