Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.12.2010, 14:36
Новичок на форуме
Отправить личное сообщение для harek13 Посмотреть профиль Найти все сообщения от harek13
 
Регистрация: 05.11.2010
Сообщений: 7

блок с телефонами
доброе время суток.
задача:
есть форма. на этой форме есть поле с телефоном. есть так же кнопочка добавить.
требуется при нажатии на кнопочку добавлять еще 1 поле с телефонами.
максимальное число полей с телефонами 3.
вопрос - как это все можно реализовать на jquery?
вариант есть такой скрыть все это дело display:none и при нажатии просто менять свойство на видимое
так же можно сделать через клонирование.
буду признателен любой помощи.
пример html верстки:
<div id="ph">
                           <div class="form_label" >Телефон*</div>
                           <div class="form_input" >
                              <select class="select_border" id="phone_tip" name="phone_tip">
                                 <option value="0">1Городской</option>
                                 <option value="1">Сотовый</option>
                              </select>
                              <input maxlength="2" type="text" class="select_border" id="gor_sot" name="gor_sot" value=" 8" disabled="disabled" />
                              <input maxlength="3" type="text" class="select_border" id="phone_kod" name="phone_kod" />
                              <input maxlength="9" type="text" class="select_border" id="phone_nomer" name="phone_nomer" />
                              <input id="ind" style="display: none"></input>
                           </div> 
                           <div class="phone_add_change">
                              <img src="images/phone_add.png" id="phone_add" name="phone_add" alt="" />
                           </div>
                           <div class="form_input_msg" id="err_phone">
                              <div class="msg_tip" style="display:block">
                                 <div class="tip_l" id="err_phone_tip_l"></div>
                                 <div class="tip_c" id="err_phone_tip_c">Только цифры</div>
                                 <div class="tip_r" id="err_phone_tip_r"></div>
                                 <img src="images/check.png" alt="" />
                              </div>
                           </div>
                        </div>
                        <div id="ph2" style="display: none">
                           <div class="form_label" id="phone_label2" style="">&nbsp;</div>
                           <div class="form_input" id="phone_input2" style="">
                              <select class="select_border" id="phone_tip2" name="phone_tip2">
                                 <option value="0">2Городской</option>
                                 <option value="1">Сотовый</option>
                              </select>
                              <input maxlength="2" type="text" class="select_border" id="gor_sot2" name="gor_sot2" value=" 8" disabled="disabled" />
                              <input maxlength="3" type="text" class="select_border" id="phone_kod2" name="phone_kod2" />
                              <input maxlength="9" type="text" class="select_border" id="phone_nomer2" name="phone_nomer2" />
                           </div>
                           <div class="phone_add_change" id="phone_add_change2">
                              <img src="images/phone_del.png" id="phone_del2" name="phone_del2" alt="" />
                           </div>
                           <div class="form_input_msg" id="err_phone2" style="">
                              <div class="msg_tip">
                                 <div class="tip_err_l" id="err_icq_tip_l"></div>
                                 <div class="tip_err_c" id="err_icq_tip_c">Только цифры</div>
                                 <div class="tip_err_r" id="err_icq_tip_r"></div>
                                 <img src="images/check.png" alt="" />
                              </div>
                           </div>
                        </div>
                        <div id="ph3" style="display: none;">      
                           <div class="form_label" id="phone_label3" style="">&nbsp;</div>
                           <div class="form_input" id="phone_input3" style="">
                              <select class="select_border" id="phone_tip3" name="phone_tip3">
                                 <option value="0">3Городской</option>
                                 <option value="1">Сотовый</option>
                              </select>
                              <input maxlength="2" type="text" class="select_border" id="gor_sot3" name="gor_sot3" value=" 8" disabled="disabled" />
                              <input maxlength="3" type="text" class="select_border" id="phone_kod3" name="phone_kod3" />
                              <input maxlength="9" type="text" class="select_border" id="phone_nomer3" name="phone_nomer3" />
                           </div>
                           <div class="phone_add_change" id="phone_add_change3" style="" onMouseOver="phone_add_change('phone_add3','over_del')" onMouseOut="phone_add_change('phone_add3','out_del')">
                              <img src="images/phone_del.png"  id="phone_del3" name="phone_del3" alt="" onclick='phone_del_number("phone_label3","phone_input3","phone_add_change3","err_phone3","phone_tip3","phone_kod3","phone_nomer3");' />
                           </div>
                           <div class="form_input_msg" id="err_phone3" style="">
                              <div class="msg_tip">
                                 <div class="tip_err_l" id="err_icq_tip_l"></div>
                                 <div class="tip_err_c" id="err_icq_tip_c">Только цифры</div>
                                 <div class="tip_err_r" id="err_icq_tip_r"></div>
                                 <img src="images/check.png" alt="" />
                              </div>
                           </div>
                        </div>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Показать/скрыть блок Lelja_05 jQuery 10 01.07.2013 19:05
Блок с сообщением - Javascript или jQuery qwermjk Общие вопросы Javascript 3 12.07.2010 08:48
Фиксированный блок kakarotto Элементы интерфейса 2 08.07.2010 23:20
Всплываюший блок! daron jQuery 5 14.05.2010 10:20
Неподвижный блок snapik (X)HTML/CSS 4 22.03.2008 23:52