Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.06.2010, 09:48
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Обработка события у селектора, добавляемого с помощью append
Здравствуйте.
Имею следующий код:
<form action="">
  <fieldset>
     <p class="software">    
       <select name="what">
          <option>Выберите название программы *</option>
          <option value='Программа 1'>Программа 1</option>
          <option value='Программа 2'>Программа 2</option>	
      </select>
      <input type="text" name="reg_num" value="Регистрационный номер *" />
    </p>
    <p class="add"><a href="#">Добавить программу</a></p>
  </fieldset>
</form>

function addSoftware() {
	  $("p.software:first").clone(true).append("&nbsp;&nbsp;<a class='del' href='#'>удалить</a>").insertBefore(this)
	}
	
function delSoftware() {
	  $(this).closest("p.software").remove()	
	}

$("p.add").click(addSoftware)
$("a.del").click(delSoftware)

Но обработка с помощью функции delSoftware почему-то не работает. Есть подозрение, что селектор a.del скрипт не видит. Так ли это и как можно выйти из ситуации?
Ответить с цитированием
  #2 (permalink)  
Старый 03.06.2010, 09:53
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,246

вы назначаете обработчик события на еще не существующие элементы
ставьте обработчик события на уже созданный объект, и все будет ок
Ответить с цитированием
  #3 (permalink)  
Старый 03.06.2010, 09:58
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Сообщение от Gvozd Посмотреть сообщение
ставьте обработчик события на уже созданный объект, и все будет ок
Подскажите, как это сделать для данного случая?
Ответить с цитированием
  #4 (permalink)  
Старый 03.06.2010, 10:05
Аватар для micscr
Профессор
Отправить личное сообщение для micscr Посмотреть профиль Найти все сообщения от micscr
 
Регистрация: 10.09.2009
Сообщений: 1,577

function addSoftware() {
      $("p.software:first").clone(true).append("&nbsp;&nbsp;<a class='del' href='#'>удалить</a>").insertBefore(this)
    // вот тут надо найти ваш a и ему установить событие
    $("найденный a").click(delSoftware)
    }
Ответить с цитированием
  #5 (permalink)  
Старый 03.06.2010, 10:15
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

micscr, спасибо.
А еще небольшой вопрос.
Сейчас у меня клонируется первый параграф с классом software.
<p class="software">     
	       <select name="what"> 
	          <option>Выберите название программы *</option> 
	          <option value='Программа 1'>Программа 1</option> 
	          <option value='Программа 2'>Программа 2</option>   
	      </select> 
	      <input type="text" name="reg_num" value="Регистрационный номер *" /> 
	    </p>

Хотелось бы, чтобы клонировался этот параграф, но к name добавлялся уникальный номер, например, what1, what2, reg_num1, reg_num2 и т.п. Это с помощью jQuery возможно сделать?
Ответить с цитированием
  #6 (permalink)  
Старый 03.06.2010, 10:38
Аватар для micscr
Профессор
Отправить личное сообщение для micscr Посмотреть профиль Найти все сообщения от micscr
 
Регистрация: 10.09.2009
Сообщений: 1,577

Сообщение от Юрий Шу Посмотреть сообщение
Это с помощью jQuery возможно сделать?
Да.
После клонирования поустанавливайте эти атрибуты name в нужные значения $('что-то').attr(name, 'what' + ind).
ind самое простое - наращивайте при добавлении глобально и будет уникальным.
Ответить с цитированием
  #7 (permalink)  
Старый 03.06.2010, 11:05
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

micscr, что-то я по-моему тут наворочил…
function addSoftware() {
	  var newObject = $("p.software:first").clone(true).append("&nbsp;&nbsp;<a class='del' href=''>удалить</a>").insertBefore(this);
	  jQuery.each(newObject, changeAttributes)
	  $("a.del").click(delSoftware)
	  return false
	}
	
	function changeAttributes(i){
	    $(newObject + "select").attr(name, 'what' + i)
	    $(newObject + "input").attr(name, 'reg_num' + i)
	}

Цитата:
$('что-то').attr(name, 'what' + ind)
Или если сделать с нарашивание ind, то тоже не работает.
var i = 0
    function addSoftware() {    
	  var newObj = $("p.software:first").clone(true).append("&nbsp;&nbsp;<a class='del' href=''>удалить</a>").insertBefore(this);  
	  i++
	  $(newObj + "select").attr(name, 'what' + i)
	  $(newObj + "input").attr(name, 'reg_num' + i)
	  $("a.del").click(delSoftware)
	  return false
	}

Последний раз редактировалось Юрий Шу, 03.06.2010 в 13:45.
Ответить с цитированием
  #8 (permalink)  
Старый 03.06.2010, 13:45
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Подскажите пожалуйста, как верно написать…
Ответить с цитированием
  #9 (permalink)  
Старый 03.06.2010, 14:04
Аватар для micscr
Профессор
Отправить личное сообщение для micscr Посмотреть профиль Найти все сообщения от micscr
 
Регистрация: 10.09.2009
Сообщений: 1,577

newObj.find("select").attr(name, 'what' + i);
Ответить с цитированием
  #10 (permalink)  
Старый 03.06.2010, 15:02
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

micscr, благодарю. Только свойство name нужно указать в кавычках.

Последний раз редактировалось Юрий Шу, 03.06.2010 в 15:05.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обработка события focus для input:text Юрий Шу jQuery 8 02.06.2010 15:57
Обработка события выделения текста cabelas jQuery 0 26.11.2009 15:03
Обработка события Deep Events/DOM/Window 12 29.07.2009 22:58