無法讓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在回發時觸發

回答

相關問題