Как да променя заглавието на някакъв текст в зависимост от радиото с jquery? - jquery, радио бутон, заглавие, текстова информация

Както можете да видите http://jsbin.com/erivi/ Използвам Jquery, за да променям някой образ (и атрибут на изображението) в зависимост от избрания радио бутон, премахвам и текста на формуляра, когато кликвам вътре в него.

И сега това, което се опитвам да направя, е да променя текста на формуляра в зависимост от проверения радио бутона.

Например при кликване върху "Избор 3" трябва да видим "Текст на вход 3".

Можете да видите и редактирате моя код на живо тук: http://jsbin.com/erivi/edit

Частта, която трябва да подобря, е:

  imgFldr = "http://download.kde.org/khotnewstuff/icons/previews/";
$("input[type="radio"]").click(function() {
var strarr = this.title.split("|");
if(strarr.length < 2) return;
$("#"+this.name).attr("src", imgFldr+strarr[0]).attr("alt", strarr[1]).attr("title", starr[2]);
});

И особено .attr("title", starr[2]); която трябва да промени заглавието в зависимост от третата част от заглавието на радиото ми (например: title="m602-1.png|Logo 3|Text of input 3" )

Благодаря :)

Редактиране: Забравих да спомена, че използвам няколко форми на моя реален код, затова търся начин да направя това без конкретното име на въвеждания текст, за да се избегне повтаряне на скрипта за друг текст.

Отговори:

2 за отговор № 1

РЕДАКТИРАНЕ: Идентификаторът на текстовото поле за въвеждане трябва да бъде уникален. Освен това трябва да зададете .attr("title",strarr[2]), .val(strarr[2]) и класа на намек в събитие за натискане на бутона за избор. Също така някои промени трябва да бъдат направени във вашия inputdynvalue плъгин.

Моля, вижте пълния актуализиран работен код на адрес http://jsbin.com/akawo

Актуализиран код на Plug-in

(function($) {
$.fn.inputdynvalue = function (options) {
var opts = $.extend({}, $.fn.inputdynvalue.defaults, options);
return this.each(function(){
var hvalue = opts.htext;
switch (opts.htext) {
case "title" : hvalue = $(this).attr("title"); break;
case "value" : hvalue = $(this).attr("value"); break;
}
$(this).attr("value", hvalue).addClass(opts.hclass)
.unbind("focus blur")
.bind("focus", function() {
if (this.value === this.title) {
this.value = "";
$(this).removeClass(opts.hclass);
}
})
.bind("blur", function() {
if (this.value === "") {
this.value = this.title;
$(this).addClass(opts.hclass);
}
});
});
};
$.fn.inputdynvalue.defaults = {
htext: "title",
hclass: "hint"
};
})(jQuery);
$(document).ready(function(){
$("input[type="text"]").inputdynvalue();
});

Актуализиран радио бутон Натиснете Handler за събития

$("input[type="radio"]").click(function() {
var strarr = this.title.split("|");
if(strarr.length < 2) return;
$("#"+this.name).attr("src", imgFldr+strarr[0]).attr("alt", strarr[1]);
$("#"+this.name+"_text")
.attr("title",strarr[2])
.val(strarr[2])
.addClass("hint");
});

---

1 за отговор № 2

Опитайте тази:

<form method="post" action="">
<div>
<img id="iymok" src="/images/http://download.kde.org/khotnewstuff/icons/previews/m732-1.png" alt="Alt by default" />
<input type="text" id="iymok_text" title="Blablabla Text 1" />
<label><input type="radio" checked="checked" name="iymok" title="m133-1.png|Logo 1|Blablabla Text 1" />Choice 1</label>
<label><input type="radio" name="iymok" title="m203-1.png|Logo 2|Text of input 2" />Choice 2</label>
<label><input type="radio" name="iymok" title="m602-1.png|Logo 3|Text of input 3" />Choice 3</label>
</div>
</form>
<script type="text/javascript">
imgFldr = "http://download.kde.org/khotnewstuff/icons/previews/";
$("input[type="radio"]").click(function() {
var strarr = this.title.split("|");
if (strarr.length >= 3) {
$("#"+this.name).attr("src", imgFldr+strarr[0]).attr("alt", strarr[1]).attr("title", strarr[2]);
$("#"+this.name+"_text").attr("title", strarr[2]);
}
});
</script>

---