请求jquery相关的简单帮助

我试图在下面的代码中做一些更改，该代码通过使用jquery单击来更新投票数。但是，如下图所示，我想显示开箱即用的投票号码。我想让它，使我点击相同的绿色框，但我显示了绿色框外的数字。我很难做到这一点。

以下是原始代码： Jquery：

$（函数（）{
$（“.vote”）。单击（函数（）{
var id=$（this.attr（“id”）；
var name=$（this.attr（“name”）；
var dataString='id='+id；
var parent=$（这是）；
如果（名称=='up'）{
$（this.fadeIn（200.html）（“”）；
$.ajax({
类型：“POST”，
url:“up_vote.php”，
数据：dataString，
cache:false，
成功：函数（html）{
html（html）；
}  }); 
}否则{
$（this.fadeIn（200.html）（“”）；
$.ajax({
类型：“POST”，
url:“down_vote.php”，
数据：dataString，
cache:false，
成功：函数（html）{
html（html）；
}   
});
}
返回false；
});
});

下面是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>

身体{
字体系列：'Georgia'，Times New Roman，Times，衬线；
}
#主要{
高度：80px；边框：1px虚线#29ABE2；边距底部：7px；
宽度：500px；
}
a{
颜色：#DF3D82；
文字装饰：无；
}
a:悬停{
颜色：#DF3D82；
文字装饰：下划线；
}
.起来{
高度：40px；字体大小：24px；文本对齐：居中；背景色：#009900；页边距底部：2px；
-moz边界半径：6px；-webkit边界半径：6px；
}
.上a{
颜色：#FFFFFF；
文字装饰：无；
}
a:悬停{
颜色：#FFFFFF；
文字装饰：无；
}
.下来{
高度：40px；字体大小：24px；文本对齐：居中；背景色：#cc0000；页边空白顶部：2px；
-moz边界半径：6px；-webkit边界半径：6px；
}
.下a{
颜色：#FFFFFF；
文字装饰：无；
}
a:悬停{
颜色：#FFFFFF；
文字装饰：无；
}
.box1{
浮动：左侧；高度：80px；宽度：50px；
}
.box2{
浮动：左；宽度：440px；文本对齐：左；
左侧边距：10px；高度：60px；顶部边距：10px；
字体大小：粗体；
字号：18px；
}

非常感谢您的帮助。

这是给您的礼物

简而言之，数字位于由

parent

变量定义的元素内。将ajax回调中的

parent=$（this）

替换为

parent=$（this）.parents（'.box1'）

和

parent.html（html）

替换为

parent.append（html）

更新

再摆弄一下：

我在

之后添加了

，这是一个数字的占位符。

---

它有一个CSS类

.number

，使它变成红色并居中。在这个代码变体中，您不必更改ajax回调，只需设置

parent=$（this）.parents（'.box1'）.find（'.number'）

您能发布样式定义吗？非常感谢您的回复。我在上面添加了CSS。非常感谢您的时间和帮助。谢谢。。但当我试图将此代码与我的代码结合起来从数据库中获取动态编号时，它不起作用。谢谢您的回复。但当我试图将您的代码与我的代码结合起来从数据库中获取动态数字时，它似乎不起作用。请看：这里是simple up_vote.php代码：我将非常感谢您的帮助。再次感谢。我更改了代码，似乎有效：。更改：切换到

$.post（）

而不是

$.ajax（）

，将数据作为JSON而不是字符串传递，url设置为JSFIDLE的echo服务器（它返回您发送给它的

html

参数）

<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>