完整的json数组包含一个小的json数组 点击完整json数组的其他元素时小json数组返回的值也没了
**
实际上点击任何一个元素 之前的都会消失 而且心 和肝 点击后背景不会退掉**
var arr1 = [ { "name" : "心", "acupoint_num" : "1" }, { "name" : "肝",
"acupoint_num" : "2" }, { "name" : "脑袋", "acupoint_num" : "3" }, { "name" : "屁股",
"acupoint_num" : "4" } ];
var retStr = ",";
$('#xueweiList').append(
$(arr1).map(
function() {
return '<li id=' + this.acupoint_num
+ '><a href="#" >' + this.name
+ '</a></li><li>'
}).get().join(''));
$("#nav>ul>li").click(
function() {
var focus = $(this).toggleClass('h_nav_over')
.hasClass('h_nav_over');
if (focus)
retStr += this.id + ',';
else
retStr = retStr.replace(',' + this.id + ',',
',');
$("#xueweis").val(retStr.replace(/^,|,$/g, ''));
});
/* 2-获取疾病对应穴位 */
var arr2 = [ { "earName" : "心", "acupoint_num" : "1" }, { "earName" : "肝",
"acupoint_num" : "2" } ];
var arrStr2 = '';
var xueweisStr = "";
$.each(arr2, function(index2, item) { // 获取后台传来的json是数组
arrStr2 += "<input type='button' id='"
+ arr2[index2].acupoint_num + "' value='"
+ arr2[index2].earName + "' name='earName'/>";
$.each(arr1, function(index, item) {
if(arr2[index2].acupoint_num==arr1[index].acupoint_num){
$("#"+arr1[index].acupoint_num).css({"background-color":"#98bf21"});
$("#xueweis").val(xueweisStr);//直接用js返回对应的穴位值给inupt赋值
}
});
xueweisStr += arr2[index2].acupoint_num + ",";
});
$("#xueweis").val(xueweisStr);//直接用js返回对应的穴位值给inupt赋值
var td2 = document.getElementById("xueweiTd2");
var div2 = document.getElementById("xuewei2");
div2.innerHTML = arrStr2;
td2.appendChild(div2);
});
这个是没有点击脑袋之前 小的json数组包含 1 和2 两个id 对应 心和肝
这个是点击脑袋之后 1 和2 都没有了
终于实现了 把代码贴出来 就是版面还没有弄好
/* 根据id修改用户信息 pjc 2016.4.21 */
function updateEd100(id) {
$.ajax({
type : "POST",
url : "/miaolangzhong/manage/forAjax.do?requestType=6",
data : "id=" + id, // 发送到服务器的数据
success : function(msg) {
alert(msg);
var json = eval('(' + msg + ')');
document.getElementById("addEd100").style.display = "block";
/* 获取后台传来的json是数组 循环获取数据 */
$.each(json, function(index, item) {
document.getElementById("id1").value = json[index].id;
document.getElementById("name1").value = json[index].name;
document.getElementById("desc1").value = json[index].desc;
/*1- 获取所有穴位 包括下面的事件是一个整体 */
/*var arr1 = eval(json[index].xuewei);*/
var arr1 = [ { "name" : "心", "acupoint_num" : "1" }, { "name" : "肝",
"acupoint_num" : "2" }, { "name" : "脑袋", "acupoint_num" : "3" }, { "name" : "屁股",
"acupoint_num" : "4" } ];
var retStr = ",";
$('#xueweiList').append(
$(arr1).map(
function() {
return '<li id=' + this.acupoint_num
+ '><a href="#" >' + this.name
+ '</a></li><li>'
}).get().join(''));
$("#nav>ul>li").click(
function() {
var focus = $(this).toggleClass('h_nav_over')
.hasClass('h_nav_over');
if (focus)
retStr += this.id + ',';
else
/*retStr = retStr.replace(',' + this.id + ',',
',');*/
retStr = retStr.replace(',' + this.id + ',',
',');
$("#xueweis").val(retStr.replace(/^,|,$/g, ''));
});
/* 2-获取疾病对应穴位 */
/*var arr2 = eval(json[index].ear_acupoint);*/
var arr2 = [ { "earName" : "心", "acupoint_num" : "1" }, { "earName" : "肝",
"acupoint_num" : "2" } ];
var arrStr2 = '';
$.each(arr2, function(index2, item) { // 获取后台传来的json是数组
arrStr2 += "<input type='button' id='"
+ arr2[index2].acupoint_num + "' value='"
+ arr2[index2].earName + "' name='earName'/>";
$.each(arr1, function(index, item) {//大数组嵌套在小数组
if(arr2[index2].acupoint_num==arr1[index].acupoint_num){
//$("#"+arr1[index].acupoint_num).css({"background-color":"#98bf21"});
$("#"+arr1[index].acupoint_num).addClass('h_nav_over');
}
});
retStr += arr2[index2].acupoint_num + ",";
});
/*//去掉第一个逗号
if (retStr.substr(0,1)==',') retStr=retStr.substr(1);
//去掉最后一个逗号
var reg=/,$/gi;
retStr=retStr.replace(reg,"");*/
$("#xueweis").val(retStr.replace(/^,|,$/g, ''));
//$("#xueweis").val(retStr);//直接用js返回对应的穴位值给inupt赋值
var td2 = document.getElementById("xueweiTd2");
var div2 = document.getElementById("xuewei2");
div2.innerHTML = arrStr2;
td2.appendChild(div2);
});
}
});
}
本体部分
<div id="addEd100"
style='display: none; z-index: 11; left: 0px; top: 0px; width: 100%; height: 100%; position: absolute;'>
<form action="/miaolangzhong/manage/forJsp.do?requestType=16"
method="post">
<table width="99%" border="0" cellpadding="0" cellspacing="0"
class="CContent">
<tr>
<th class="tablestyle_title">世界卫生组织推荐</th>
</tr>
<tr>
<td class="CPanel">
<table border="0" cellpadding="0" cellspacing="0"
style="width: 100%">
<TR>
<TD width="100%">
<fieldset style="height: 100%;">
<legend>世界卫生组织推荐</legend>
<table border="0" cellpadding="2" cellspacing="1"
style="width: 100%">
<tr>
<input type="hidden" name="id1" id="id1" onblur="Checkname()" />
<!-- 编辑后跳转到当前的列表页 -->
<input type="hidden" value=${page.num } id="currentPageNum2"
name="currentPageNum2">
<!-- 添加后跳转到最后页面 -->
<input type="hidden" value=${page.count } id="pageCount"
name="pageCount">
<td nowrap align="right" width="15%">疾病名称:</td>
<td width="35%"><input name='name' type="text"
id="name1" class="text" style="width: 154px" value="" /> <span
class="red">*</span></td>
</tr>
<tr>
<td width="15%" nowrap align="right" height="100">简介:</td>
<td colspan="3"><textarea name="desc" cols="100"
id="desc1" rows="10"></textarea></td>
</tr>
<tr>
<td width="15%" nowrap align="right" height="100">对应的穴位:</td>
<td colspan="3" id="xueweiTd2"><div id="xuewei2"
class="h_nav_over"></div></td>
</tr>
<tr>
<td width="15%" nowrap align="right" height="100">取穴:</td>
<td colspan="3" id="xueweiTd">
<div id="nav">
<ul id="xueweiList"></ul>
<input id="xueweis" name="xueweis">
</div>
</td>
</tr>
</table>
<br />
</fieldset>
</TD>
</TR>
</TABLE>
</td>
</tr>
<TR>
<TD colspan="2" align="center" height="50px"><input
type="submit" name="Submit" value="保存" class="button"
onclick="alert('保存成功!');" /> <input type="button" name="Submit2"
value="返回" class="button" onclick="window.history.go(-1);" /></TD>
</TR>
</TABLE>
</form>
</div>
css 样式部分
<style type="text/css">
.ul, li {
list-style: none;
}
#nav li {
display:table-cell;
border:1px solid #666666;
margin: 0 5px;
background: #ccc;
padding: 0px 0px;
line-height: 24px;
font-size: 12px;
float:left;
}
#nav li.h_nav_over {
background: red;
color: #fff;
}
#nav li.h_nav_over a {
color: #fff;
}
a {
text-decoration: none;
}
</style>
http://ask.csdn.net/questions/270831
给retStr 赋值,你都没有依据已经选中的内容给retStr 这个变量赋值,还是空的,你再选中肯定没有了
已经设置成 retstr 了 点击事件怎么修改
$("#nav>ul>li").click(
function() {
var focus = $(this).toggleClass('h_nav_over')
.hasClass('h_nav_over');
if (focus)
retStr += this.id + ',';
else
retStr = retStr.replace(',' + this.id + ',',
',');
$("#xueweis").val(retStr.replace(/^,|,$/g, ''));
});
下面是全部代码
function updateEd100(id) {
$.ajax({
type : "POST",
url : "/miaolangzhong/manage/forAjax.do?requestType=6",
data : "id=" + id, // 发送到服务器的数据
success : function(msg) {
alert(msg);
var json = eval('(' + msg + ')');
document.getElementById("addEd100").style.display = "block";
/* 获取后台传来的json是数组 循环获取数据 */
$.each(json, function(index, item) {
document.getElementById("id1").value = json[index].id;
document.getElementById("name1").value = json[index].name;
document.getElementById("desc1").value = json[index].desc;
/*1- 获取所有穴位 包括下面的事件是一个整体 */
/*var arr1 = eval(json[index].xuewei);*/
var arr1 = [ { "name" : "心", "acupoint_num" : "1" }, { "name" : "肝",
"acupoint_num" : "2" }, { "name" : "脑袋", "acupoint_num" : "3" }, { "name" : "屁股",
"acupoint_num" : "4" } ];
//var retStr = ",";
$('#xueweiList').append(
$(arr1).map(
function() {
return '<li id=' + this.acupoint_num
+ '><a href="#" >' + this.name
+ '</a></li><li>'
}).get().join(''));
$("#nav>ul>li").click(
function() {
var focus = $(this).toggleClass('h_nav_over')
.hasClass('h_nav_over');
if (focus)
retStr += this.id + ',';
else
retStr = retStr.replace(',' + this.id + ',',
',');
$("#xueweis").val(retStr.replace(/^,|,$/g, ''));
});
/* 2-获取疾病对应穴位 */
/*var arr2 = eval(json[index].ear_acupoint);*/
var arr2 = [ { "earName" : "心", "acupoint_num" : "1" }, { "earName" : "肝",
"acupoint_num" : "2" } ];
var arrStr2 = '';
var retStr = "";
$.each(arr2, function(index2, item) { // 获取后台传来的json是数组
arrStr2 += "<input type='button' id='"
+ arr2[index2].acupoint_num + "' value='"
+ arr2[index2].earName + "' name='earName'/>";
$.each(arr1, function(index, item) {
if(arr2[index2].acupoint_num==arr1[index].acupoint_num){
//$("#"+arr1[index].acupoint_num).css({"background-color":"#98bf21"});
$("#"+arr1[index].acupoint_num).addClass('h_nav_over');
}
});
retStr += arr2[index2].acupoint_num + ",";
});
$("#xueweis").val(retStr);//直接用js返回对应的穴位值给inupt赋值
var td2 = document.getElementById("xueweiTd2");
var div2 = document.getElementById("xuewei2");
div2.innerHTML = arrStr2;
td2.appendChild(div2);
});
}
});
}
这样改完之后 那个 id 为1 的一直去不掉