Jquery добавление контента методом after

Maza

Maza

Постоялец
Регистрация
2 Июл 2007
Сообщения
255
Реакции
120
Подскажите, как можно подгрузить страницу с помощью jquery после определённого блока <div> в данном случае, после after_post, чтобы при этом он плавно появлялся.
В закоменченном варианте он отображает как надо но грузит прямо в блок
<div id='after_post'>

HTML: 
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<script type='text/javascript' src='jquery-1.7.2.js'></script>
<link rel='stylesheet' type='text/css' href='css/form.css'>
<link rel='stylesheet' type='text/css' href='css/reset.css'>
 
<script>
    $(document).ready(function(){
        $("#stype").change(function () {
            var type = $('#stype option:selected').val().split(":");
            if (type[1] == 0){
                //$('div#after_post').fadeOut(100 , function(){ $(this).load('add_tech.php'); }).fadeIn( 500 );
                $('#after_post').after( function(){ $(this).load('add_tech.php'); } );
            }
            return false;
        });
    });
</script>
 
</head>
<body>
 
<div id='container_index'>
<form id='add_data'>
 
    <div class='formLine'>
        <label for='type' class='leftlabel' > <font style='color:#ff0000'>*</font>Тип:</label>
        <select id='stype' size='1'>
            <option value='-1' disabled selected>Выберите тип</option>
            <option value='0:0'>0</option>
            <option value='0:1'>1</option>
        </select>
    </div>
   
    <div class='formLine' id='after_post'>
        <label for='number' class='leftlabel' >№ :</label>
        <input type='text' id='number' />
    </div>
 
   <!-- Здесь должна подгружаться другая стр -->
</form>
</div>
 
</body>
</html>
 
по ходу $(this).load('add_tech.php') фактически это $('#after_post').load('add_tech.php') поэтому и грузит непосредственно в этот блок...
А что, если после блока after_post заранее впихнуть span или что-то подобное, и уже в него грузить данные?
 
  • Нравится
Реакции: Maza
Со span получилось, но всё таки интересно можно ли сделать, так чтоб дополнительные теги не прописывать, и было плавное появление пока дошёл до такого велосипеда, осталось сделать чтобы плавно появлялось, чуствую не получится....
HTML: 
$.get('add_tech.php', function(data){
$('#after_post').after( data );});
 
Попробовал ещё так, но не вышло....
HTML: 
$.get('add_tech.php', function(data){
                    $('#after_post').after(   
                        function(){
                        $(this).fadeOut(100 ,
                            function(){
                            return data;
                            }).fadeIn( 500 );
                    });
                });
 
может попробовать так:
Код: 
<style>
.afdata{
display: none;
}
</style>
.........
 
$.get('add_tech.php', function(data){
                    $('#after_post').after('<span class="afdata">'+ data+'<span/>' );
                    $('.afdata').fadeIn('slow');
});
 
  • Нравится
Реакции: Maza
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху