jQuery показване на скрити елементи

[d_badboy]

Не се извежда съдържанието на скрит div. Помагайте :lol:

$(document).ready(function(){
$("#add_mod").hide();
$("#cont").
fadeOut("slow",function(){$("#cont").html(loading);}).
fadeIn("slow",function(){$("#add_mod").show();});
});

<div id="cont">
<div id="add_mod">asdasdasd</div>
</div>

 

[crazy_pi4]

А защо тоя код като го копирам на моя комп не работи? В смисъл дива си е показан... какво трябва да направя?

 

[startx]

А защо тоя код като го копирам на моя комп не работи? В смисъл дива си е показан... какво трябва да направя?

Защото не е оказано във функцията

 

[d_badboy]

crazy_pi4 трябва да включиш фаилът свален от http://jquery.com/ преди този код
startx какво имаш в предвид ?

 

[startx]

Javascript

// show hide div index
$(document).ready(function() {

	$("a[id^='category']").click(function () {
		var id = 'reveal' + $(this).attr('id').replace('category', '');

		if ($('#'+id)) {
			if ($('#'+id).css('display')=='none') {
				$('#'+id).show('slow');
			} else {
				$('#'+id).hide('slow');
			}
		}

		return false;
	});


	$("a[id^='toggle_div']").click(function () {
		var id = '#div' + $(this).attr('id').replace('toggle_div', '');

		if ($(id)) {
			if ($(id).css('display')=='none') {
				$(id).show('slow');
			} else {
				$(id).hide('slow');
			}
		}

		return false;
	});

});

 html code

<a href="" title="Допълнително информация" id="toggle_category1>">допълнително информация »</a>
<div id="category1>" style="display:none;">
Тука вмъкваш скритата информация.
</div>

Това е един от начините

 

[startx]

Ако искаш да изкаваш допълнителни полета при селект на категория скрипта е съвсем друг. Ето го и него.

optionplugin.js

var optionsPluginObjectId = 0;
var optionsPluginObjectCollection = [];

function optionsPlugIn (selectBoxSelector, valueFields) {
	this.selectBoxSelector = selectBoxSelector;
	this.valueFields = valueFields;
	this.selectBox = null;
	this.OID = optionsPluginObjectId;
	optionsPluginObjectCollection[this.OID] = this;

	this.init = function() {
		this.selectBox = $(this.selectBoxSelector);
		if (this.selectBox.length > 0) {
			this.selectBox.attr('optionspluginobjectid',this.OID);
			for (i in this.valueFields) {
				for (j in this.valueFields[i]) {
					$(this.valueFields[i][j]).addClass('optionspluginshowable_'+this.OID);
					$(this.valueFields[i][j]).hide();
				}
			}
			this.selectBox.change(function(){
				if (typeof(optionsPluginObjectCollection[$(this).attr('optionspluginobjectid')]) != 'undefined') {
					try {
						optionsPluginObjectCollection[$(this).attr('optionspluginobjectid')].showFields($(this).val());
					} catch (e) {}
				}
			});
		}
	};

	this.showFields = function(theVal) {
		$('.optionspluginshowable_'+this.OID).hide();
		if (typeof(this.valueFields[theVal]) != 'undefined') {
			for (i in this.valueFields[theVal]) {
				if (i.match(/^[0-9]*$/)) {
					$(this.valueFields[theVal][i]).show();
				}
			}
		}
	};

	this.init();
	optionsPluginObjectId++;

}

HTML CODE

<script src="optionsplugin.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(document).ready(function(){
		var	optionChange = new optionsPlugIn('#myselect',{	'1':['#optionfield1','#optionfield2'],
		'2':['#optionfield3','#optionfield4']
														});
		});
	</script>

<select id="myselect" name="test222">
		<option value="1">val1</option>
		<option value="2">val2</option>
		<option value="3">val3</option>
		<option value="4">val4</option>
	</select>
		<div id="optionfield1"><label>1</label><input type="text" name="input1"/></div>
		<div id="optionfield2"><label>2</label><input type="text" name="input2"/></div>
		<div id="optionfield3"><label>3</label><input type="text" name="input3"/></div>
		<div id="optionfield4"><label>4</label><input type="text" name="input4"/></div>

Както се вижда в option plugina при селектиране на val1 извиква 2та инпута optionfield1 и 2 така при val2 извиква 3 и 4

 

[startx]

Незабравяй да лоуднеш и jquery мода преди optionplugina иначе ... няма да работи нищо.

 

[d_badboy]

Благодаря ви много Утре ще погледна защото сега не съм в състояние понеже адски много ми се спи. Ако има проблеми ще пиша, а ако няма получаваш точка :?:

 

[d_badboy]

startx благодаря за подробните примери. Искам да уточня за какво става въпрос при конкретния случай. интересното е, че при alert ми вади id на div-а, но не се извежда съдържанието му :lol:

$(document).ready(function(){
    $("#add_mod").hide();
    $("#chat_mod").hide();

    $("#row div, #coll div").click(function(){
        var my_id = "#"+$(this).attr("id")+"_mod";
        var loading = '<img src="ajax-loader.gif" alt="loading" />';

        $("#cont").
        fadeOut("slow",function(){$("#cont").html(loading);}).
        fadeIn("slow",function(){
            $(my_id).show(); // fadeIn("slow");
            alert(my_id); // тук показва правилното id
        });

    });
});

Мисля че няма нужда от return false , понеже нямам линкове, а просто div тагове, на които се клика

<div id="add_mod">asd</div>
<div id="chat_mod">qwe</div>