如图,点击右边某一行的编辑按钮,弹出一个窗口,其中的内容是根据同一行的表格中的识别规则进行还原的。主要涉及都包括了通过Ajax从后台获取的数据,以及JS根据数据生成表格来填入。
重点来了:
点击编辑,还原窗口的过程,我用到了
$("td[name='fieldname']").html(temp); //这里temp是数据
通过观察我们发现
这个$("td[name='fieldname']").html(temp);有时候可以成功填入,有时候却失败,没有办法填入
$("td[name='fieldname']")有时候无法获取窗口中的那个位置,请问主要的原因是什么?
如果描述不够详细,请指出,谢谢。
——————————————————————————————————————————————————————
不好意思,因为有事耽误了下,未能及时回复。谢谢toBeTheLight的建议。
补充一下
上面截图中的编辑规则窗口是隐藏在页面中的一部分html,使用了layer的弹窗插件将这部分代码显示在弹窗中,其中标签列表的部分是动态生成的。
//这是标签列表的初始html
枚举值 | 字段 | 计算 | 操作 | 输入 |
这是根据后台的数据,填充表格的内容 $.ajax({ type: "post", url: basePath + "/rule/getenum", data: {"labelName": labelName}, dataType: "json", success: function (data) { var arr=new Array(); if (data.indexOf(",") != -1) { arr = data.split(","); } else if (data.indexOf(","!= -1)) { arr = data.split(","); } var content = ""; var html = ""; var opt=""; var cal=""; var input=""; for (var i = 0; i < arr.length; i++) { content = " 枚举 字段 计算 操作 输入 "; html += content; } $("#enumListBody").html(html) }, error: function () { } }); " + arr[i] + " " + "" + "" + " " + "" + cal + " "+"" + opt + " " + "" + input + "
//这个是根据后台解析的数据,进行页面的还原的部分 $.ajax({ type: "post", url: basePath + "/rule/getcalculate", data: {"field": fieldName}, dataType: "json", success: function (data) { $("#field").find("option[value='"+fieldName+"']").attr("selected",true); console.log("-------------Begin----------------------"); console.log("填充的字段对象为:",$("td[name='fieldname']")); console.log("填充的字段对象为:",$("td[name='calculate']")); console.log("填充的字段对象为:",$("td[name='operate']")); console.log($("#enumListBody").innerHTML); console.log("-------------------------------------"); var temp=$("#field").val().split(":")[0]; $("td[name='fieldname']").html(temp); // console.log("填充的字段对象为:",$("td[name='fieldname']")); // console.log("data=",data); var ans = JSON.parse(data); var cal = new Array(); for (var key in ans[0]) { cal.push(key); } var calhtml = ""; $("td[name='calculate']").html(calhtml); var opthtml = ""; $("td[name='operate']").html(opthtml); $("td[name='calculate']").find("select").bind("change", function () { var calchangehtml = ""; $(this).closest('tr').children().eq(3).html(calchangehtml); }); var numinput = ""; var strinput = ""; var datesinput = "" + "" var dateinput = ""; var operate = $("td[name='operate']").find("option:selected").val(); if (operate == "介于") { $("td[name='inputname']").html(datesinput); } else if (operate == "早于等于" || operate == "晚于等于" || operate == "早于" || operate == "晚于") { $("td[name='inputname']").html(dateinput); } else if (operate == "匹配" || operate == "不匹配") { $("td[name='inputname']").html(strinput); } else { $("td[name='inputname']").html(numinput); } var rows = document.getElementById("enumListBody").rows.length; var colums = document.getElementById("enumListBody").rows[0].cells.length; var table = document.getElementById("enumListBody"); console.log(table.innerHTML); for (var i = 1; i < rows; i++) { var cal= ruledata[i-1].ys; var opt= ruledata[i-1].cz; var input1 = ruledata[i-1].iv1; var input2 = ruledata[i-1].iv2; for (var j = 0; j < colums; j++) { var obj = table.rows[i].cells[j]; if(j==2){ $(obj).find("option[value='"+cal+"']").attr("selected",true); } if(j==3) { $(obj).find("option[value='"+opt+"']").attr("selected",true); } if(j==4){ $(obj).find("input[name='inputone']").attr("value",input1); $(obj).find("input[name='inputtwo']").attr("value",input2);; } } } getChangeInput(); //输入框校验部分 }, error: function (data) { } }); }
是不是页面还没加载完就点击按钮,页面还没渲染td[name='filename']这个标签,所以获取不到这个对象