Укоротить события функции JavaScript - PullRequest
1 голос
/ 18 июня 2011

У меня есть страница, как показано ниже;

<head>
<script type="text/javascript" src="jquery-1.6.1.js"></script>
<script type="text/javascript">
$(document).ready( function() {
  var i = 1;
$('#prev').click(function() {
  $.ajax({
  type: 'POST',
  url: 'ajax.php',
  data: 'id=' + i,
  dataType: 'json',
  cache: false,
  success: function(result) {
    $('#content1').html(result[0]);
    $('#content2').html(result[1]);
    $('#content3').html(result[2]);
    $('#content4').html(result[3]);
    $('#content5').html(result[4]);
    $('#content6').html(result[5]);
  },
  });
  i++;
});
});
</script>
</head>
<body>
<table>
<tr>
<td id="prev">prev</td>
<td id="content1">X</td>
<td id="content2">X</td>
<td id="content3">X</td>
<td id="content4">X</td>
<td id="content5">X</td>
<td id="content6">X</td>
<td id="next">next</td>
</tr>
</table>
</body>

Код работает хорошо. Но есть ли решение сделать это за один шаг? Я имею в виду, могу ли я предоставить контент 1-6 общему классу content вместо конкретных идентификаторов. Как я могу это сделать, если у ячеек контента нет определенных идентификаторов (от content1 до content6 и есть общий класс content)?

Заранее спасибо ..

Ответы [ 3 ]

3 голосов
/ 18 июня 2011

Посмотрите на итератор .each ()

$('.content').each(function(index){
     $(this).html(result[index]);
});
3 голосов
/ 18 июня 2011

Вы могли бы использовать это в вашем случае:

success: function(result) {
    for(var i=0; i < 6; i++)
    {
      $('#content' + (i + 1)).html(result[i]);
    }
  }

Однако, если у дивизий #content нет идентификатора для использования, вы должны установить каждый из них по очереди..

Вы также можете использовать итератор jQuery each, если сможете получить все content деления за один вызов:

$('div .content').each(function(ind)
{
  $(this).html(result[ind]);
});
0 голосов
/ 18 июня 2011

Если у вас больше ничего нет с result, вы также можете сделать:

success: function(result) {
    $.each(result,function(i,e){
      $('#content' + (i + 1)).html(e);
    });
  }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...