Javascript Ajax JQuery

Question

Вот моя проблема.

У меня есть функция javascript, которая обновляет div, когда я нажимаю на соответствующую ссылку. И это работает.

Так как я нажал на ссылку, мой div-контент обновляется другим Javascript. На этот раз, чтобы закрыть его.

Это довольно просто, но я не могу заставить его работать, и я не знаю почему!

Вот код, который находится на странице при первой загрузке

div id config_window

<div id="config_window" class="config_window">
<div id="conception" class="conception">Conception et design graphique <a href ="http://url">Zéro Gravité.</a>
</div>
<div id="admin_btn"class="admin_btn"><a href ="#">administration.</a></div>
<div id="test">test</div>
</div>

Теперь Javascript, который требует обновления внутри этого div

<script language="javascript" type="text/javascript">

 $("#admin_btn").click(
        function(){

     $('#config_window').addClass('config_open');
       config_set('config_window','open','var')
    }

    );

</script>

Пока это работает, мой div обновляется, и я вижу новый контент. Новый контент

<div id="conception" class="conception">Conception et design graphique <a href ="http://zedproduction.com">Zéro Gravité.</a>
</div>
<div id="admin_btn_x" class="admin_btn"><a href ="#">Terminer.</a></div>

<script language="javascript" type="text/javascript">
    $("#admin_btn_x").click(
        function(){
     $('#config_window').removeClass('config_open');
       config_set('config_window','close','var')
    }
    );
</script>

Я ожидал, что та же функция сработает, но ее нет !! и я не понимаю почему, так как первый.

Может ли быть так, что мой второй скрипт в div, который обновляется ??

Спасибо!

Answer 1

Есть ли причина, по которой вы добавляете функцию для разделения на два сценария? Я бы изменил ваш сценарий на что-то вроде этого:

    <script type="text/javascript">
        $(document).ready(function() {
            $('#config_window').hide(); // just in case
            $('#admin_btn').bind("click", function() {
                if($('#config_window').is(':hidden')){
                    $('#config_window').show();
                        config_set('config_window','open','var')
                } else {
                    $('#config_window').hide();
                      config_set('config_window','close','var')
                }               
            }); 
        }); 
    </script>

Answer 2

Я подозреваю, что это потому, что элемент, к которому должен применяться второй обработчик, не существует до тех пор, пока DIV не обновится, а функция, применяющая обработчик, не будет выполнена до обновления DIV - поэтому обработчик не применяется. Возможно, вы захотите попробовать использовать действующие обработчики для события click, чтобы оно применялось ко всем элементам, соответствующим селектору, независимо от того, когда этот элемент добавлен. Вы можете добавить оба обработчика при загрузке страницы, и они будут применяться к элементам с этими идентификаторами, независимо от того, добавляются они динамически или нет.

<script type="text/javascript">
    $("#admin_btn").live('click', function(){
       $('#config_window').addClass('config_open');
       config_set('config_window','open','var')
    });

    );
    $('#admin_btn_x').live('click', function() {
       $('#config_window').removeClass('config_open');
       config_set('config_window','close','var')
    });
</script>