使用ajax從代碼隱藏調用JavaScript

所以我有這種想法創建一個asp.net用戶控件，以處理所有形式的模態彈出窗口（無論是錯誤處理，窗體，對話框等）。使用ajax從代碼隱藏調用JavaScript

我之前已經創造了這個，把用戶控制在頂部母版頁，它暴露的所有內容的網頁，所以我可以做這樣的事情：

Master.Popup.ShowException(Exception);

而且用戶控件本身擁有必要的標記看起來像一個模態對話框，並在show方法中做一個.Visible = true。

這樣很好，但我已經開始考慮用jQuery實現一些樣式。我想讓用戶控件在展會上展示某種jQuery動畫。但我不知道如何去實現這一點，因爲我不知道如何從代碼隱藏而不是popup.visible = true調用jquery函數。

任何人都可以提供一個可能的解決方案嗎？

來源

2011-02-16 Dynde

內，您的Master.Popup.ShowException（....），可以這麼用：

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "animateJS", "animateMyBox('popupid');", true);

凡animateMyBox（...）是你想要做的任何一個動畫。最後做popup.display =「block」;等

此外，查找，如果你可以傳遞一個函數回調你的動畫代碼，將在動畫後執行。像：

animateMyBox('popupid', function() { document.getElementById('popupid').display='block'; })

另一種可能性是使用動畫，將在框最終被在像動畫不透明度從0到100％的端可見。

我知道這是含糊的，但你必須分享更多的代碼，才能得到更好的答案。

來源

2011-02-16 08:38:13

您可以創建這使得控制的javascript：

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.ComponentModel; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Text; 

namespace WebApplication1 
{ 
    [DefaultProperty("EffectType"), ToolboxData("<{0}:jQueryAnimation runat=server></{0}:jQueryAnimation>")] 
    public class jQueryAnimation : System.Web.UI.WebControls.WebControl 
    { 
     private const string SCRIPT_KEY = "jQueryAnimation"; 

     [Bindable(true), Category("Appearance"), DefaultValue("Bounce")] 
     public string EffectType { get; set; } 
     public string ControlId { get; set; } 

     protected override void OnPreRender(EventArgs e) 
     { 
      base.OnPreRender(e); 
      RegisterAnimationScript(); 
     } 

     protected override void RenderContents(HtmlTextWriter writer) 
     { 
      base.RenderContents(writer); 
     } 

     private void RegisterAnimationScript() 
     { 
      if (!Page.ClientScript.IsClientScriptBlockRegistered(SCRIPT_KEY)) 
      { 

       StringBuilder script = new StringBuilder(); 
       script.Append("<script type='text/javascript'>"); 
       script.Append(Environment.NewLine); 
       script.Append("$(document).ready(function() {"); 
       script.Append(Environment.NewLine); 
       script.Append("var options = {};"); 
       script.Append(Environment.NewLine); 
       script.Append("$('#"); 
       script.Append(this.ControlId); 
       script.Append("').effect('"); 
       script.Append(this.EffectType); 
       script.Append("', options, 1500, "); 
       script.Append(this.ControlId); 
       script.Append("_callback);"); 
       script.Append(Environment.NewLine); 
       script.Append("function "); 
       script.Append(this.ControlId); 
       script.Append("_callback() {"); 
       script.Append(Environment.NewLine); 
       script.Append("setTimeout(function() {"); 
       script.Append("$('#"); 
       script.Append(this.ControlId); 
       script.Append("').removeAttr('style').hide().fadeIn();"); 
       script.Append("}, 1000);};"); 
       script.Append(Environment.NewLine); 
       script.Append("});"); 
       script.Append(Environment.NewLine); 
       script.Append("</script>"); 

       Page.ClientScript.RegisterClientScriptBlock(Page.GetType(),SCRIPT_KEY,script.ToString()); 
      } 
     } 
    } 
}

我已經定義的屬性EffectType這是您要執行的效果名稱; ControlId是您想要製作動畫的HTML元素的ID。
RegisterAnimationScript輸出javascript來執行動畫。在你的ASPX，你必須註冊控件

<%@ Register assembly="WebApplication1" namespace="WebApplication1" tagprefix="cc1" %>

然後放下你的控制（它應該出現在你的工具箱）

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <div id="test" style="width:100px;height:100px;background-color:Red">&nbsp;</div> 
     <cc1:jQueryAnimation ID="jQueryAnimation1" runat="server" EffectType="Shake" ControlId="test"></cc1:jQueryAnimation> 
    </div> 
    </form> 
</body> 
</html>

這裏，我結合我塞雷爾語控制jQueryAnimation到div測試（ControlId="test"），我已經定義了我想要應用的效果（EffectType="Shake"）。
雖然在C＃中管理JavaScript並不是很容易，但是;-)

來源

2011-02-16 09:54:54 LeftyX

使用ajax從代碼隱藏調用JavaScript

回答

相關問題