change event дублиране на съдържание

User avatar
teroristd
Много Редовен
Много Редовен
Reactions: 0
Posts: 1775
Joined: Thu Feb 18, 2010 11:50 am
Answers: 83

change event дублиране на съдържание

Post by teroristd »

Здравейте, ще опитам да направя по-детайлно описание за да разберете проблема.
Имам радиобутони, които ще са много на брой но за примера нека са три. При натискане на радиобутон се изпълнява change event, в който викам един jquery плугин, който създава рамки, но нека за примера да използваме просто един append с текст. Проблема е че при всяко натискане на радиобутон това което викам в евента се натрупва, а целта е да е само един път на натискане.

Нека преди кода да дам пример какво се случва в момента.
Натискаме радиобутон 1 и се визуализира текст TEST.
Натискаме радиобутон 2 и се визуализира текст TEST TEST.
Натискаме радиобутон 3 и се визуализира текст TEST TEST TEST.
И така до безкрай. С други думи при всяко натискане се визуализира текст но стария от предишното си остава, а аз искам старото да се махне и да се зареди новото.

Ето и малко код.

<form id="myform" method="post">

<input type="radio" name="frame" value="TEST 1" />
<input type="radio" name="frame" value="TEST 2/>
<input type="radio" name="frame" value="TEST 3" />

<div class="inner"></div>

<input type="submit" name="submit" value="submit">

</form>

<script>

$('#myform input[type=radio]').bind('change', function (event) {

$( ".inner" ).append( "<p>TEST</p>" );

});

</script>
by uphero » Mon Mar 15, 2021 7:03 pm Go to full post
uphero
Потребител
Потребител
Reactions: 0
Posts: 799
Joined: Mon Feb 20, 2012 12:26 pm
Answers: 35
Location: Казанлък
Contact:

Re: change event дублиране на съдържание

Post by uphero »

User avatar
Revelation
Web-tourist
Web-tourist
Reactions: 1
Posts: 958
Joined: Sun Mar 24, 2013 1:23 pm
Answers: 68

Re: change event дублиране на съдържание

Post by Revelation »

А защо append-ваш щом не искаш да се стакват? Просто използвай

Code: Select all

$('.inner').html("<p>TEST</p>");
User avatar
teroristd
Много Редовен
Много Редовен
Reactions: 0
Posts: 1775
Joined: Thu Feb 18, 2010 11:50 am
Answers: 83

Re: change event дублиране на съдържание

Post by teroristd »

Благодаря ви за отговорите, но явно примера който съм дал не отговаря на реалната ситуация. Аз всъщност не искам да добавям текстове, ами викам един плугин, който взима клас на снимка и слага рамка около нея. Кода отдолу в този вид ще добавя една и съща рамка върху картинката при всяко натискане на радиобутон, една над друга. Целта ми е да добавя различни рамки според това кой бутон е натиснат без да ги трупа една върху друга. Ето линк към плугина има и демо за да добиете представа https://github.com/joonaspaakko/Image-F ... ery-plugin

Code: Select all


HTML:
<form id="myform" method="post">

<input type="radio" value="frame_1" />
<input type="radio" value="frame_1/>
<input type="radio" value="frame_3" />

<div class="img-container">
	<img class="frame_1" src="path to image">
</div>

<input type="submit" name="submit" value="submit">

</form>

<script>

$('#myform input[type=radio]').bind('change', function (event) {

	$('.frame_1').imageframer();

});

</script>

User avatar
anonimen
Web-tourist
Web-tourist
Reactions: 1
Posts: 1612
Joined: Mon Jun 11, 2012 6:07 pm
Answers: 167
Location: Parse error: unexpected "}" in /home/index.php on line 26

Re: change event дублиране на съдържание

Post by anonimen »

Тогава можеш да си пазиш в променлива чисто копие на снимката без рамка. При change event я записваш в .img-container (тоест изчистваш снимката със старата рамка – както Revelation ти показа за смяна на текст) и върху новозаписаната чиста снимка викаш плъгина.

Иначе може и да има вариант ръчно да премахваш ефекта на плъгина, но тогава кодът ти зависи от вътрешната структура на тоя плъгин и не е рентабилно.
User avatar
teroristd
Много Редовен
Много Редовен
Reactions: 0
Posts: 1775
Joined: Thu Feb 18, 2010 11:50 am
Answers: 83

Re: change event дублиране на съдържание

Post by teroristd »

Точно изчистването не става. Пробвах хиляди варианти и не можах да го измисля.
User avatar
Revelation
Web-tourist
Web-tourist
Reactions: 1
Posts: 958
Joined: Sun Mar 24, 2013 1:23 pm
Answers: 68

Re: change event дублиране на съдържание

Post by Revelation »

Щом библиотеката не позволява да изчистваш рамката, тогава ресетваш нещата и прилагаш рамката наново.

В интерес на истината можеш да пробваш при onChange просто да смениш frameType-а. Т.е. за всеки радио бутон си запиши frameType-а и го подавай на плъгина като взимаш стойността от event.
User avatar
teroristd
Много Редовен
Много Редовен
Reactions: 0
Posts: 1775
Joined: Thu Feb 18, 2010 11:50 am
Answers: 83

Re: change event дублиране на съдържание

Post by teroristd »

Revelation wrote: Tue Mar 16, 2021 5:13 pm Щом библиотеката не позволява да изчистваш рамката, тогава ресетваш нещата и прилагаш рамката наново.

В интерес на истината можеш да пробваш при onChange просто да смениш frameType-а. Т.е. за всеки радио бутон си запиши frameType-а и го подавай на плъгина като взимаш стойността от event.
Точно ресетването не се получава. Как да го направя? При смяна на frameType-а слага новия над предишния.
User avatar
teroristd
Много Редовен
Много Редовен
Reactions: 0
Posts: 1775
Joined: Thu Feb 18, 2010 11:50 am
Answers: 83

Re: change event дублиране на съдържание

Post by teroristd »

Благодаря на всички за отговорите. Успях да намеря решение. Оказва се че ако плугина не е предвидил изчистване не може директно да се ресетнат нещата. За това започнах да чистя елементите които добавя един по един. Така се получи.
User avatar
Revelation
Web-tourist
Web-tourist
Reactions: 1
Posts: 958
Joined: Sun Mar 24, 2013 1:23 pm
Answers: 68

Re: change event дублиране на съдържание

Post by Revelation »

Като видях как са го направили на демо страницата им и ми се щеше да се хвърля през прозореца.
Post Reply