-5

jqueryを使用してwhileループにあるビューボタンをクリックしてdivの詳細を表示しようとしていますが、最初のレコードのみが表示され、残りのレコードは表示されません.誰かがこの問題を解決するように教えてくれます..

サンプルコードは次のとおりです。

 <html>
<head>
<script src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){ 
    $('#view').click(function() {
    var user=$('#user').text();
      alert(user);
    }); 
  });
</script>
<style type="text/css">
#content div{display:inline-block;}
</style>
</head>
<body>
<?php
$i=0;
while($i<5)
{
?>
<div id="content">
<div id="user">Street(<?=$i+1?>)</div>
<div id="view" style="color:green;cursor:pointer;">View</div>
</div>
<?php
$i++;
}
?>
</body>
</html>
4

3 に答える 3

2

id一意であることを意味します (Jquery では を使用して示されます#)。class代わりに (Jquery using で示されている) を使用してみてください.。

<div class="content">
<div class="user">Street(<?=$i+1?>)</div>
<div class="view" style="color:green;cursor:pointer;">View</div>
</div>

そしてJavaScript：

<script type="text/javascript">
    $(function(){ 
        $('.view').click(function() {
            var user=$(this).parent().find('.user').text();
            alert(user);
        }); 
    });
</script>
于 2013-04-04T06:05:58.297 に答える
0

id="user" を設定したため、同じ id を持つ 5 つの div が取得されるため、明らかに最初の 1 つだけが出力されます。だからクラスを使う。

そして、現在の要素の値を取得するには、使用します

$(this).text();
于 2013-04-04T06:10:04.280 に答える
0

これを試してみてください..

<html>
<head>
<script src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){ 
    $('.view').click(function() {        
        var id = $(this).attr('id');
        var user=$('#user'+id).text();
        alert(user);
    }); 
  });
</script>
<style type="text/css">
#content div{display:inline-block;}
</style>
</head>
<body>
<?php
$i=0;
while($i<5)
{
?>
<div id="content">
<div class="user" id="user<?php echo $i+1;?>">Street(<?php echo $i+1;?>)</div>
<div class="view" id="view<?php echo $i+1;?>" style="color:green;cursor:pointer;">View</div>
</div>
<?php
$i++;
}
?>
</body>
</html>
于 2013-04-04T06:16:00.593 に答える