Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Помогите плиз с append (https://javascript.ru/forum/jquery/52754-pomogite-pliz-s-append.html)

lok105 05.01.2015 13:26

Помогите плиз с append
 
Добрый день! Возможно вопрос и не относится на прямую к append.

Задача:

Есть несколько одинаковых строк

<p>Строка</p>
<p>Строка</p>
<p>Строка</p>

Через append, нажимая на нижнюю строку создается такая же строка под последней

<p>Строка</p>
<p>Строка</p>
<p>Строка</p>
<p>Строка</p> - новая строка

Сам вопрос. Как сделать, что бы следующая такая же строка создавалась при нажатии на последнюю (т.е. новую строку), а не на предпоследнюю?

Спасибо!

рони 05.01.2015 14:38

lok105,
:-?
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .orange {
    background: #FFCC00;
  }

  p:last-child  {
     cursor: pointer;
     background: rgb(0, 153, 51);
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var s = 1;
       $("body").on("click" ,"p:last", function() {
         $(this).after($("<p/>", {"text" : "новая строка"+s++, "class" : "orange"}));
      });
});


  </script>
</head>

<body>
 <p>Строка</p>
 <p>Строка</p>
 <p>Строка</p>

</body>

</html>

lok105 05.01.2015 17:14

Отлично! спасибо огромное!!!

krutoy 05.01.2015 17:51

рони,
А не проще ли, вместо того чтобы постоянно дергать поиск по дому, сделать что то вроде этого:
<html>
<head>
</head>
<body>


<script>


add=function(){
   this.onclick=null
   var p=document.createElement("p")
   p.innerHTML="string"
   p.onclick=add
   document.body.appendChild(p)
}

add()


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

рони 05.01.2015 18:05

krutoy,
ваше проще мне видится как выхолостить - как неуниверсальный вариант подойдёт - всётаки jquery более гибкая в плане применения -- вдруг не body -- а куча контейнеров и в этих контейнерах есть другие строки и ваш код нарастёт ... но вы конечно и в этом обойдётесь без jquery ... каждый программирует как он программирует ... ваше решение имеет право на существование ...

lok105 05.01.2015 18:18

Да, там если быть точнее вот так будет:


HTML:

<table id="tableTraffic">
             <tr>
                 <td><input class='pole' type='text' name='Come'/></td>
             </tr>
             <tr>
                 <td><input class='pole' type='text' name='Come'/></td>
             </tr>
</table>


и смысл, что бы нажимая на последнее(нижнее) поле ввода, ниже появлялось еще одно и так нескончаемо

krutoy 05.01.2015 18:33

lok105,
Это не важно
<html>
<head>
</head>
<body>

<table id="tableTraffic">
</table>

<script>


table=document.querySelector("#tableTraffic")
add=function(){
   this.onclick=null
   var tr=document.createElement("tr")
   tr.innerHTML="<td><input class='pole' type='text' name='Come'/></td>"
   tr.onclick=add
   table.appendChild(tr)
}

add()


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

danik.js 05.01.2015 19:23

krutoy, зачем учишь народ плохому?

krutoy 05.01.2015 20:47

danik.js,
Чем меньше народа будут выдрачиваться под это говно, тем быстрей оно сдохнет. Так что ты должен спасибо еще сказать, я санитар "леса"

krutoy 05.01.2015 20:54

danik.js,
Да и вообще, есть блять, стандарт ECMA, есть спеки, есть, семантика, и есть совершенно другой ЯП в вакууме, где блять, какие то заморочки, и который работает в каком то говне, по недоразумению называемом браузером. Я что, должен 2 языка теперь учить вместо одного? Шел бы ты подальше со своими полезными советами. Мне насрать на адептов IE


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