Форум АНТИЧАТ

Форум АНТИЧАТ (https://forum.antichat.xyz/index.php)
-   PHP, PERL, MySQL, JavaScript (https://forum.antichat.xyz/forumdisplay.php?f=37)
-   -   подгрузка на ajax, или изменение кода на стороне клиента (https://forum.antichat.xyz/showthread.php?t=149202)

.::BARS::. 18.10.2009 14:19
подгрузка на ajax, или изменение кода на стороне клиента
 
вопрос такого плана... есть картинки

img1 img2 img3

3 дива

<div pop></div>
<div rap></div>
<div popca></div>

и

поле для вывода текста

==========

допустим при нажатии на img1 вызывается текст лалала - это впринципе ничего сложного, но как сменить <div pop></div> на
<div rap></div>? т.е. нужно не подгрузить содержимое, а внести изменение в код...
див должен смениться не перезагрузив страницу...

m0Hze 18.10.2009 14:46
Цитата:
Сообщение от .::BARS::.
вопрос такого плана... есть картинки

img1 img2 img3

3 дива

<div pop></div>
<div rap></div>
<div popca></div>

и

поле для вывода текста

==========

допустим при нажатии на img1 вызывается текст лалала - это впринципе ничего сложного, но как сменить <div pop></div> на
<div rap></div>? т.е. нужно не подгрузить содержимое, а внести изменение в код...
див должен смениться не перезагрузив страницу...
Ни слова не понял вообще.

diGriz 18.10.2009 14:51
Что-то типа этого:
Код:
<script type="text/javascript">

 $(function() {
            $('#myLink').click(function() {
            $("#pop").attr({
            id: "rap",
          });
        });
    });

</script>
<a href="#" id="myLink">Click</a>
<div id="pop">sss</div>

.::BARS::. 18.10.2009 14:56
Цитата:
Ни слова не понял вообще.
- ниже уже ближе

Цитата:
<script type="text/javascript">

$(function() {
$('#myLink').click(function() {
$("#pop").attr({
id: "rap",
});
});
});

</script>
<a href="#" id="myLink">Click</a>
<div id="pop">sss</div>
а как теперь передать в клике индефикатор.. на что менять, на pop или на popsa

.::BARS::. 18.10.2009 15:02
<script type="text/javascript">

$(function() {
$('#myLink').click(function() {
$("#1").attr({
id: "2",
});
});
});

</script>
<a href="#" id="myLink">Click1</a>
<a href="#" id="myLink">Click2</a>
<a href="#" id="myLink">Click3</a>
<div id="1">sss</div>
<div id="2">sss</div>
<div id="3">sss</div>

-----------

вот впринципе так... но в этом коде он сменит просто див с 1 на 2
а если я опять нажму на клик1, но назад не меняет...

POS_troi 18.10.2009 15:10
jQuery - копай

.::BARS::. 18.10.2009 15:15
Цитата:
Сообщение от POS_troi
jQuery - копай
копал... ничего хорошего не накопал..

aqqa 18.10.2009 15:23
непонятно про какой ты идентификатор говоришь...
Вот те офф. офигительная документация с примерами по жквери
http://docs.jquery.com/Manipulation/replaceWith#content

diGriz 18.10.2009 15:24
Код:
$(function() {
            $('#myLink').click(function() {
                    var attribute = $("#pop").attr("id");
                        if(attribute == 'pop') {
                                //alert(attribute);
                                $("#pop").attr({ id: "rap",});
                        } else {
                                $("#rap").attr({ id: "pop",});
                        }
        });
    });

.::BARS::. 18.10.2009 15:48
http://slavabars.ru/11.JPG
http://slavabars.ru/22.JPG
http://slavabars.ru/33.JPG

вот как надо...
где крестик - это на что нажимает...
цветная область - это и есть div

.::BARS::. 18.10.2009 15:51
Цитата:
Сообщение от aqqa
непонятно про какой ты идентификатор говоришь...
Вот те офф. офигительная документация с примерами по жквери
http://docs.jquery.com/Manipulation/replaceWith#content
совершенно не то

-=Zhenek=- 18.10.2009 16:23
А не проще ли просто при нажатии на кнопку скрывать не нужные дивы?

visible:none

.::BARS::. 18.10.2009 16:31
не проще... нужно именно менять див

imajo.ati 18.10.2009 20:17
PHP код:
<img alt="img1" src="./img1" onclick="document.getElementById('out').innerHTML =document.getElementById('pop').innerHTML">
<img alt="img2" src="./img2" onclick="document.getElementById('out').innerHTML =document.getElementById('rap').innerHTML">
<img alt="img3" src="./img3" onclick="document.getElementById('out').innerHTML =document.getElementById('popca').innerHTML">

<div id="pop">123</div>
<div id="rap">456</div>
<div id="popca">789</div>

<div id="out">тут будет содержимое дива</div> 

Helios 18.10.2009 20:58
Если я тебя правильно понял и нужно изменить параметры/содержимое сужествующего элемента в коде, то используй obj.getAttribute(name) и obj.setAttribute(name, value) для работы с его аттрибутами и obj.innerHtml/obj.outerHtml для его содержимого.

Причем последний полностью перезапишет код, вместе с самим тегом:
Код:
было:

<div id="foo">...</div>
<div id="bar">...</div>
<div id="other">...</div>

выполнили:
document.getElementById('bar').outerHTML = '<span>test</span>';

стало:
<div id="foo">...</div>
<span>test</span>
<div id="other">...</div>

.::BARS::. 19.10.2009 01:39
Helios, не надо перезаписывать сам тег, нужно сменить только имя дива

imajo.ati, нифига не выходит.... меняет только если див уже выведен в браузер.... подгрузки нет..



http://slavabars.ru/5.JPG


вот что надо... при щелчке на первую афишу, картинка в левом верхнем углу - меняется на поп, на середину - на рок, на третью, - попса...

вот как выглядет это в хтмл

Цитата:
<!--
**********************************
Классы для смены картинок

rnb-entry
pop-entry
dj-entry
hiphop-entry
rnr-entry

**********************************
-->


<div class="entry rnr-entry">

содержимое

<li><div><a href="#"><img src="assets/i/temp/af.jpg" alt="" /></a></div><i></i></li>
<li class="active"><div><a href="#" title="Фото 8"><img src="assets/i/temp/af.b.jpg" alt="" /></a></div><i></i></li>
<li><div><a href="#"><img src="assets/i/temp/af.jpg" alt="" /></a></div><i></i></li>

содержимое

</div>

.::BARS::. 19.10.2009 14:11
<div class="entry rnr-entry"> - вот этот фрагмент самый злостный...

Helios 19.10.2009 14:52
ну так кто тебе мешает пользоваться setAttribute?

Код:
function setClass(div_id, classname)
{
    document.getElementById(div_id).setAttribute('class', 'entry ' + classname);
}


Время: 05:18