Библиотека Jquery

[Grigory]

Всегда работал с Prototype, но сейчас нужно написать на jQuery кое-что, посему появилась куча проблем. Одна из них: работа с новыми DOM-элементами уже после того, как сделал $(document).ready().

Судя по Гуглу, нужно сделать re-bind, но во всех 5 примерах на весь интернет ребиндят событие onclick, а мне надо заставить скрипт узнавать новый input, чтобы потом с ним использовать keydown().

 

Суть примерно такая:

$(document).ready(function() {
$("#title_edit").click(function() {

	$("#title").html("<input type=text id=title_input value=\"" + title + "\" size=50");

});

$("#title_input").keydown(function(event) {

	switch (event.keyCode) {
		case 13: alert("enter"); break;
	}
});
});

 

Насколько я понял, нужно событие title_edit.click вынести в отдельную функцию за пределы document.ready, но живых примеров не нашёл, а копаться сил нет.

Кто-то, быть может, сталкивался с этим?

 

Если кто-то не въехал в то, что я написал , то поясню: событие не отрабатывается на новый DOM-элемент, нужно сделать ребинд, но я в jQuery не особо, поэтому интересует -- как. :-)

[mr.Faster]

$("#title")

это что?

[magmoro]

Всегда работал с Prototype, но сейчас нужно написать на jQuery кое-что, посему появилась куча проблем. Одна из них: работа с новыми DOM-элементами уже после того, как сделал $(document).ready().

Судя по Гуглу, нужно сделать re-bind, но во всех 5 примерах на весь интернет ребиндят событие onclick, а мне надо заставить скрипт узнавать новый input, чтобы потом с ним использовать keydown().

 

Суть примерно такая:

$(document).ready(function() {
$("#title_edit").click(function() {

	$("#title").html("<input type=text id=title_input value=\"" + title + "\" size=50");

});

$("#title_input").keydown(function(event) {

	switch (event.keyCode) {
		case 13: alert("enter"); break;
	}
});
});

 

Насколько я понял, нужно событие title_edit.click вынести в отдельную функцию за пределы document.ready, но живых примеров не нашёл, а копаться сил нет.

Кто-то, быть может, сталкивался с этим?

 

Если кто-то не въехал в то, что я написал , то поясню: событие не отрабатывается на новый DOM-элемент, нужно сделать ребинд, но я в jQuery не особо, поэтому интересует -- как. :-)

 

никаких ребинд не надо, где ты эту ерунду прочитал. $("#title_input") создается после того как пользователь нажал на кнопку, вот и ложи этот код в событие click:

 

$(document).ready(function() {
$("#title_edit").click(function() {
	$("#title").html("<input type='text' id='title_input' value=\"" + title + "\" size=50");
	$("#title_input").keydown(function(event) {
		switch (event.keyCode) {
			case 13: alert("enter"); break;
		}
	});
});
});

[Grigory]

О, точно. Тыщу раз думал это сделать, но даже не попытался копирнуть код внутрь. :-)

Спасибки.

 

Про ребинд прочитал упоминание везде, где только пытался искать по теме работы нового DOM-элемента в Гугле.

Ребинд, оказывается, нужен для других целей.

[mr.Faster]

хз

я вставляю убираю без ребинда элементы

[Grigory]

mr.Faster

А почему я кликаю на элемент, событие исполняется, а потом повторно клик не воспринимается с тем же событием?

[magmoro]

почему я кликаю на элемент, событие исполняется, а потом повторно клик не воспринимается с тем же событием?

http://mifjs.net/misc/jq/index.html

 

кликаю по title edit, создается input, кликаю повторно — он повторно создается

[mr.Faster]

а куй его знает товарищ майор, мы тут не телепаты

[Grigory]

magmoro

http://mifjs.net/misc/jq/index.html

 

кликаю по title edit, создается input, кликаю повторно — он повторно создается

Хм... у меня Firefox3, повторно input не создается. Э?

В IE7 тоже не создается. Повтороне создание я имел ввиду не после рефреша странцы, а сразу. Если надо снова событие вызвать повторно.

 

mr.Faster

В чем проблема? Описал вполне нормально ситуацию. Просто до кого-то доходит (magmoro), а до кого-то нет.

[magmoro]

magmoro

Хм... у меня Firefox3, повторно input не создается. Э?

В IE7 тоже не создается. Повтороне создание я имел ввиду не после рефреша странцы, а сразу. Если надо снова событие вызвать повторно.

создается. Нажимаешь создать, появляется input, нажимаешь ещё раз, появляется новый, заменяющий старый. То что это новый можно заметить, набрав что-нибудь в input и кликнув — вернется значение по умолчанию. Да и в firebug это видно

[Grigory]

Ммм-м, тогда я понял, из-за чего трабл.

Я использую библиотеку jquery-timers.js... По событию focus() запускается:

	$(".link").focus(function() {

	var str = $(this).attr('id');
	var id = str.replace(/link_/, "");

		$("#link_" + id).everyTime(500, function(i) {
		if (i == 3)
		{
			$(this).stopTime();

			startFunc(id);
		}
	}, times=3);
});

Вот этот кусок кода, по идее, должен инициализировать таймер каждый раз, когда делается focus() на ссылке, но инициализирует его только единожды. Вероятно, что всему виной stopTime(), но как остановить процесс один раз, но разрешить его стартовать потом снова?

 

P.S.: А jQuery, как я и полагал, намного лучше и удобнее Prototype.

[Grigory]

Судя по Гуглу, проблема в вызове $.ajax внутри startFunc(), однако толкового объяснения причин и решения проблемы я не нашел.

Нашёл только, что нужно вынести код в функцию, но он уже и так там. Однако, проблема эта есть у многих.

 

На группах Гугла нашел совершенно всколзь упомянутый плагин LiveQuery для jQuery, который, как оказалось, предназначен решать эту проблему.

И помогло, чёрт побери! :-)

[Женька]

все верно инпут добавляется еще один но он заменяет старый)

[Женька]

елси вы хотели рекурсивое добавление инпутов и назначение на каждый функцию, то наворачиваете вы код оч сильно,

 

$(document).ready(function() {
var num =0;
$(document).ready(function() {
	$("#title_edit").click(function() {
		$('<input type=text value="" id="input'+num+'" size="50">').keydown(function(){
			alert('Keydown на '+$(this).attr('id'));
		}).appendTo("#title");
		num++;
	});
});
});

 

 

а по поводу последнего примера я бы сделал так. и проще и работает

$(document).ready(function(){
$(".link").focus(function() {
	var id = "!!!!!!!!!";
	setTimeout("startFunc('"+id+"')",500);
});
});
function startFunc(id) {
$.post('./ajax.php',{},onSuccess)
}
function onSuccess(data) {
alert(data)
}