请求jquery相关的简单帮助

Question

我正在尝试对以下代码进行一些更改，通过使用jquery单击它来更新投票数。但是，如下图所示，我希望显示开箱即用的投票编号。我想这样做，以便我点击相同的绿色框，但是我显示绿色框中的数字。我很难做到这一点。

这是原始代码： Jquery的：

<script type="text/javascript">
$(function() {

$(".vote").click(function() {
var id = $(this).attr("id");
var name = $(this).attr("name");
var dataString = 'id='+ id ;
var parent = $(this);

if(name=='up'){
$(this).fadeIn(200).html('<img src="dot.gif" align="absmiddle">');
$.ajax({
   type: "POST",
   url: "up_vote.php",
   data: dataString,
   cache: false,

   success: function(html)   {
    parent.html(html);
    }  }); 
}else{
$(this).fadeIn(200).html('<img src="dot.gif" align="absmiddle">');
$.ajax({
   type: "POST",
   url: "down_vote.php",
   data: dataString,
   cache: false,

   success: function(html)   {
       parent.html(html);
  }   
 });
}
return false;
 });
});
</script>

这里是html部分：

<div id="main">
<div class="box1">
<div class='up'><a href="" class="vote" id="<?php echo $mes_id; ?>" name="up"><?php echo $up; ?></a></div>
</div>
<div class='box2' ><?php echo $msg; ?></div>
</div>

这是Css：

<style type="text/css">
body{
font-family:'Georgia', Times New Roman, Times, serif;
}
#main{
height:80px; border:1px dashed #29ABE2;margin-bottom:7px;
width:500px;
}

a{
color:#DF3D82;
text-decoration:none;
}

a:hover{
color:#DF3D82;
text-decoration:underline;
}

.up{
height:40px; font-size:24px; text-align:center; background-color:#009900; margin-bottom:2px;
-moz-border-radius: 6px;-webkit-border-radius: 6px;
}
.up a{
color:#FFFFFF;
text-decoration:none;
}

.up a:hover{
color:#FFFFFF;
text-decoration:none;
}

.down{
height:40px; font-size:24px; text-align:center; background-color:#cc0000; margin-top:2px;
-moz-border-radius: 6px;-webkit-border-radius: 6px;
}

.down a{
color:#FFFFFF;
text-decoration:none;
}

.down a:hover{
color:#FFFFFF;
text-decoration:none;
}

.box1{
float:left; height:80px; width:50px;
}

.box2{
float:left; width:440px; text-align:left;
margin-left:10px;height:60px;margin-top:10px;
font-weight:bold;
font-size:18px;
}


</style>

非常感谢您的帮助。

Answer 1

这是fiddle给你的。

简而言之，number位于parent变量定义的元素内。将parent = $(this)替换为parent = $(this).parents('.box1')，将parent.html(html)替换为ajax回调中的parent.append(html)

<强>更新

稍微摆弄一下后：http://jsfiddle.net/CE4xh/1/。

我在<div class="number"></div>之后添加了<div class="up">，这是一个数字的占位符。 它有一个CSS类.number，使其成为红色并居中。在代码的这个变体中，您不必更改ajax回调，只需设置parent = $(this).parents('.box1').find('.number')