Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Работа с полученным через ajax html (https://javascript.ru/forum/jquery/54167-rabota-s-poluchennym-cherez-ajax-html.html)

iFATUM 06.03.2015 13:13

Работа с полученным через ajax html
 
Добрый день, участники форума.

На днях у меня возник вопрос о работе технологии ajax, который скорее относится к базовому понимаю работы технологии, а не ее применению.

Вопрос в следующем:

Скрипт:
var YmniAjax = {
  
    /* DEFAULT OPTIONS */
    type: "POST",
    cache: false,
    timeout: 180000,
    
    /* OBLIGATORY OPTIONS */
    url: undefined,
    context: undefined,
    data: {},
  
    /* METHODS */
    Request: function () {
        
        var self = this;
        
        $.ajax({
            
            type: self.type,
            cache: self.cache,
            timeout: self.timeout,

            url: self.url,
            context: self.context,
            data: self.data,

            success: function(data){

                $(this).empty();
                $(this).append(data);

            },
            
            error: function(XMLHttpRequest, textStatus, errorThrown) {
              
                /* DIPLAY ERROR IN THE CONTEXT AREA */
                $(this).empty();
                $(this).append(XMLHttpRequest.responseText);
                
                /* WRITE DATA TO THE LOG */
                console.log(XMLHttpRequest);
                console.log(textStatus);
                console.log(errorThrown);

            }
            
        });
    },
    
    Post: function () {
        
    },
    
    Get: function() {
        
    }
    
};


Страница:
<script type="text/javascript">
    
  $(function(){

    YmniAjax.context = $('#ajax_area');
    YmniAjax.url = "/ajax/front/request/";
    
    YmniAjax.Request();

     $('#load').click(function() {
        
        alert("1");
        
     });   
  });
    
</script>

<div id="ajax_area"></div>


Подгружаемая через Ajax страница:
<form method="POST">
    
    <input type="text" name="text">
    
    <input type="button" value="submit" id="load">
    
</form>


У меня есть страница html, которая используя ajax на базе jQuery подгружает html блок в указанный тег.

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

Проблема в том, что после загрузки данной формы я не могу с ней работать средствами jQuery.
Я решил начать с простого. В блок ajax_area загрузилась форма, я хочу нажать кнопку load и получить сообщение. Код для этого написан, вот только он почему-то не работает с подгруженным блоком. Если я перенесу данный кусок кода на страницу формы, то тогда все будет отлично работать, но вот с исходной страницей такой трюк не работает.

Прошу помочь решить проблему.

laimas 06.03.2015 14:27

$(document).on('click', '#load', function() ...


Скрипт и форма загружаются не одновременно же, поэтому устанавливать обработчик фактически не кому. В данном случае эта обработка делегируется документу.

iFATUM 07.03.2015 04:56

Точно, работает! Спасибо за ответ, займусь исследованием данного вопроса.


Часовой пояс GMT +3, время: 05:52.