Question

我有一个页面如下;

<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而不是特定的ID。如果内容单元格没有特定ID（从content1到content6并且具有公共类content），我该怎么做？

提前致谢..

Answer 1

你可以在你的情况下使用它：

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

但是，如果#content div没有要使用的标识符，则必须依次设置每个标识符。

如果你可以在一次调用中获得所有content div，你也可以使用jQuery each迭代器：

$('div .content').each(function(ind)
{
  $(this).html(result[ind]);
});

Answer 2

看一下.each（）迭代器

$('.content').each(function(index){
     $(this).html(result[index]);
});

Answer 3

假设您在result中没有其他任何内容，您也可以这样做：

success: function(result) {
    $.each(result,function(i,e){
      $('#content' + (i + 1)).html(e);
    });
  }

缩短javascript函数事件

3 个答案: