我创建了一个父div,并使用jquery insertAfter()
方法在父div之后插入了div ....发生了什么是我的第一条记录到底部,下一条记录插在它上面.... / p>
这是我的功能......
function Iteratejsondata(HfJsonValue) {
var jsonObj = eval('(' + HfJsonValue + ')');
for (var i = 0, len = jsonObj.Table.length; i < len; ++i) {
var employee = jsonObj.Table[i];
$('<div class="resultsdiv"><br /><span id="EmployeeName" style="font-size:125%;font-weight:bolder;">' + employee.Emp_Name + '</span><span style="font-size:100%;font-weight:bolder;padding-left:100px;">Category :</span> <span>' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" style="font-size:100%;font-weight:bolder;">Salary Basis :</span> <span>' + employee.SalaryBasis + '</span><span style="font-size:100%;font-weight:bolder;padding-left:25px;">Salary :</span> <span>' + employee.FixedSalary + '</span><span style="font-size:100%;font-weight:bolder;padding-left:25px;">Address :</span> <span>' + employee.Address + '</span></div>').insertAfter('#ResultsDiv');
}
}
我的结果是,
alt text http://img265.imageshack.us/img265/7646/divresult.jpg
Palani必须在我的父div旁边,但它位于底部...因为insertAfter()
插入#ResultsDiv
旁边的每条记录...任何建议如何在新生成的div之后插入...
修改 如何为我使用的这些div添加行颜色
function Iteratejsondata(HfJsonValue) {
var jsonObj = JSON.parse(HfJsonValue);
for (var i = jsonObj.Table.length - 1; i >= 0; i--) {
var employee = jsonObj.Table[i];
$('<div id="resDiv" class="resultsdiv"><br /><span id="EmployeeName" style="font-size:125%;font-weight:bolder;">' + employee.Emp_Name + '</span><span style="font-size:100%;font-weight:bolder;padding-left:100px;">Category :</span> <span>' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" style="font-size:100%;font-weight:bolder;">Salary Basis :</span> <span>' + employee.SalaryBasis + '</span><span style="font-size:100%;font-weight:bolder;padding-left:25px;">Salary :</span> <span>' + employee.FixedSalary + '</span><span style="font-size:100%;font-weight:bolder;padding-left:25px;">Address :</span> <span>' + employee.Address + '</span></div>').insertAfter('#ResultsDiv');
}
$("#resDiv.resultsdiv:odd").css("background-color", "#F4F4F8");
$("#resDiv.resultsdiv:even").css("background-color", "#EFF1F1");
}
但没有工作..
答案 0 :(得分:1)
扭转循环:
for (var i = jsonObj.Table.length - 1; i >= 0; i--)
备注:不使用eval
。我建议你改为JSON.parse,或者如果这个JSON来自ajax调用,jQuery应该自动将它解析为object。
更新:
要为这些div添加行颜色,您可以尝试外部循环:
$(".resultsdiv:odd").css("background-color", "#F4F4F8");
$(".resultsdiv:even").css("background-color", "#EFF1F1");
答案 1 :(得分:1)
您要在父元素之后添加元素:
<div id="ResultsDiv">
</div>
<div class="resultsdiv">...4...</div>
<div class="resultsdiv">...3...</div>
<div class="resultsdiv">...2...</div>
<div class="resultsdiv">...1...</div>
但您可能希望在元素中添加元素:
<div id="ResultsDiv">
<div class="resultsdiv">...1...</div>
<div class="resultsdiv">...2...</div>
<div class="resultsdiv">...3...</div>
<div class="resultsdiv">...4...</div>
</div>
使用appendTo
方法代替insertAfter
方法。
您正在添加具有相同ID的多个元素,这是不合法的。只需使用该类来定位元素:
$(".resultsdiv:odd").css("background-color", "#F4F4F8");
$(".resultsdiv:even").css("background-color", "#EFF1F1");