无法让jQuery在回发时触发

我已经完成了一些搜索，尝试了几个来自不同帖子的解决方案，但似乎无法让它们工作。基本思想是...我正在自定义一个现有的用户控件，它将动态生成的数据放到单个行的列表中。然后它有一个“编辑”链接按钮，它执行回发并用可编辑字段重建表格。我发现我正在使用一些jQuery将表转换成2行表，分成多列（更容易，然后试图重新设计在C＃中的数据创建/标记）。第一次加载页面时，它完美地工作。然而，当我点击“编辑”链接按钮，它适当地做回发，但jQuery不会触发。我尝试了几种配置无济于事。这里是jQuery的：无法让jQuery在回发时触发

private void RegisterScripts() 
{ 
    StringBuilder sbScript = new StringBuilder(); 
    sbScript.Append("\tvar tables = $('table[id*=\"tblAttribute\"]');\n"); 
    sbScript.Append("\tfor (var i = 0; i < tables.length; i++) {\n"); 
    sbScript.Append("\t\tvar newTable = document.createElement('table');\n"); 
    sbScript.Append("\t\tvar columns = 2;\n"); 
    sbScript.Append("\t\tfor(var c = 0; c < columns; c++) {\n"); 
    sbScript.Append("\t\t\tnewTable.insertRow(c);\n"); 
    sbScript.Append("\t\t\tfor(var r = 1; r < tables[i].rows.length ; r++) {\n"); 
    sbScript.Append("\t\t\t\tnewTable.rows[c].insertCell(r-1);\n"); 
    sbScript.Append("\t\t\t\tnewTable.rows[c].cells[r-1].innerHTML = tables[i].rows[r].cells[c].innerHTML;\n"); 
    sbScript.Append("\t\t\t\tnewTable.rows[c].cells[r-1].className = tables[i].rows[r].cells[c].className;\n"); 
    sbScript.Append("\t\t\t\ttables[i].rows[r].style.display = 'none';\n"); 
    sbScript.Append("\t\t\t}\n"); 
    sbScript.Append("\t\t}\n"); 
    sbScript.Append("\t\tnewTable.className = tables[i].className;\n"); 
    sbScript.Append("\t\ttables[i].parentNode.appendChild(newTable);\n"); 
    sbScript.Append("\t}\n"); 

    Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "RowsToColumnsScript", sbScript.ToString(), true); 

}

这里是在Page_Load周期内的呼叫：

protected void Page_Load(object sender, EventArgs e) 
{ 
    RegisterScripts(); 
    // Other Stuff // 
}

我也曾尝试RegisterClientScriptBlock()与RegisterStartupScript()代替，得到了相同的结果。我错过了什么？

编辑2：这是脚本，因为它被添加到客户端页面。我复制右出页面的源代码（减去我的缩写）：

<script type="text/javascript"> 
//<![CDATA[ 
var tables = $('table[id*="tblAttribute"]'); 
for (var i = 0; i < tables.length; i++) { 
    var newTable = document.createElement('table'); 
    var columns = 2; 
    for(var c = 0; c < columns; c++) { 
     newTable.insertRow(c); 
     for(var r = 1; r < tables[i].rows.length ; r++) { 
      newTable.rows[c].insertCell(r-1); 
      newTable.rows[c].cells[r-1].innerHTML = tables[i].rows[r].cells[c].innerHTML; 
      newTable.rows[c].cells[r-1].className = tables[i].rows[r].cells[c].className; 
      tables[i].rows[r].style.display = 'none'; 
     } 
    } 
    newTable.className = tables[i].className; 
    tables[i].parentNode.appendChild(newTable); 
} 
// Other js registered from other usercontrols 
</script>

来源

2013-12-17 gmaness

您使用的是UpdatePanel吗？ –

您可以放置警告或调试器指令来查看代码是否被执行。 –

@KarlAnderson - 不，我目前没有使用更新面板。 – gmaness

首先，你为什么不做些什么这个...

string script = @"var tables = $('table[id*=\'tblAttribute\']'); 
    for (var i = 0; i < tables.length; i++) { 
    //rest of your script 
";

这将会使你的脚本更容易阅读并进行更改。白色空间将得到尊重。所以你不需要\ n和\ t字符。

之后，在浏览器中查看生成的HTML，并确保它正确地在那里。使用浏览器的调试工具执行脚本并查看是否有任何错误产生。

或者只是将脚本嵌入.aspx页面，而不是从代码隐藏中添加它。

来源

2013-12-17 20:33:45 mason

jQuery确实有效。这不是jQuery故障排除的问题，因为它可以在初始页面加载时正常工作。这是一个试图让它在PostBack上重新执行的问题。 – gmaness

您的JavaScript期待您的表有一个包含（*=）字符串tblAttribute的ID。看起来创建新可编辑表的JavaScript不会为其添加id属性。因此，尽管您的代码隐藏注册了脚本，并且在每次回发时都会执行，但您没有看到它，因为您的新可编辑表格不符合条件$('table[id*="tblAttribute"]')。

您需要为新创建的表设置一个ID，但我不能保证此方法可行（取决于您的用户控件如何构建您可能已经在屏幕上显示的各种表格）：

newTable.setAttribute("id", "tblAttribute" + i);

显然，id必须是唯一的，这样简单地增加你的迭代器tblAttribute可能会产生冲突，但是这应该让你指出正确的方向。

编辑

看到与该UpdatePanel更新后的评论，你可能会发现这个答案有帮助： Registering scripts with an UpdatePanel

来源

2013-12-18 01:45:36 ethorn10

伟大的想法，但在这种特殊情况下，当回发发生时，完全不同的表格由后面的代码呈现，仍然符合“tblAttribute”条件。回发后，我使用页面上的检查元素对此进行了验证。这实际上是为什么我使用“id * =”来确保它选择了回发前表和回发后表。 – gmaness

@gmaness我添加了一个可能有所帮助的编辑 – ethorn10

尝试包裹准备功能

$(function(){ 
    // place your code here 
});

里面你的jQuery代码。

<script type="text/javascript"> 
$(function(){ 
    //<![CDATA[ 
    var tables = $('table[id*="tblAttribute"]'); 
    for (var i = 0; i < tables.length; i++) { 
    var newTable = document.createElement('table'); 
    var columns = 2; 
    for(var c = 0; c < columns; c++) { 
     newTable.insertRow(c); 
     for(var r = 1; r < tables[i].rows.length ; r++) { 
      newTable.rows[c].insertCell(r-1); 
      newTable.rows[c].cells[r-1].innerHTML = tables[i].rows[r].cells[c].innerHTML; 
      newTable.rows[c].cells[r-1].className = tables[i].rows[r].cells[c].className; 
      tables[i].rows[r].style.display = 'none'; 
     } 
    } 
    newTable.className = tables[i].className; 
    tables[i].parentNode.appendChild(newTable); 
    } 
    // Other js registered from other usercontrols 
}); 
</script>

来源

2013-12-18 05:27:45

无法让jQuery在回发时触发

回答

相关问题