Блог

у меня такая ситуация внутри xxx.php :

 <form id="s">
<input id="q"/>
<input type="submit" href="Search!"/>
</form>
<div id="r"></div>
  

внутри у foo.php меня есть другая форма:

 <form id="ss">
<input id="qq"/>
<input type="submit" href="Search!"/>
</form>
<div id="rr"></div>
  

и внутри у yyy.php меня есть другая форма:

 <form id="sss">
<input id="qqq"/>
<input type="submit" href="Search!"/>
</form>
<div id="rrr"></div>
  

внутри javascript.js у меня есть :

 $('#s').submit(function(evt) {
evt.preventDefault();
$.ajax({
url: 'foo.php',
data: {
    query: $('#q').val()
  },
success: function(data) {
    $('#r').html(data);
  }
});
return false;
});

$('#ss').submit(function(evt) {
evt.preventDefault();
$.ajax({
url: 'yyy.php',
data: {
    query: $('#qq').val()
  },
success: function(data) {
    $('#rr').html(data);
  }
});
return false;
});
  

что происходит, так это то, что когда я отправляю первую форму, загружается вторая, так что теперь у меня есть 2 формы (как и ожидалось), но когда я отправляю вторую форму, третья не загружается с помощью ajax, но перенаправляется на нее путем обновления.

итак, в основном мне нужно выполнить как можно больше загрузок ajax

есть идеи?

Спасибо

Вы должны использовать .live , потому что вы добавляете данные динамически

 $('#ss').live('submit', function(evt) {
evt.preventDefault();
$.ajax({
url: 'yyy.php',
data: {
    query: $('#qq').val()
  },
success: function(data) {
    $('#rr').html(data);
  }
});
return false;
});
  

Вам нужно использовать текущие события для вещей, которые вы динамически загружаете в so в вашем случае:

 $("#ss").live('submit', function (e) {
   // Code here
});
  

Вам нужно использовать текущие события только для вещей, которые не всегда есть в DOM. Если вы запрашиваете страницы через ajax, а затем намереваетесь их использовать, вам нужно будет использовать live events.

Смотрите : http://api.jquery.com/live / Для получения более подробной информации