Jquery函数不适用于动态创建的div元素 [英] Jquery function doesn't works for a dynamically created div element

问题描述

我正在尝试使用动态创建的Htmldiv元素向用户显示一些信息。



我甚至添加了jquery函数来显示该特定元素有一些很酷的效果，比如fadeIn或animate功能，（也在c＃中。）



这里有2个场景，



1.如果我添加动态div，在page.controls.Collection的开头，Jquery

函数将起作用，但我的aspx页面中已存在的静态控件的ViewState将丢失，（当我在集合的最开始添加div元素时，可能会修改控件的视图状态顺序）



2.所以为了保留现有控件的视图状态，我需要在集合的末尾添加动态控件，但在这种情况下，jquery函数将无效！



所以，当我显示动态控件时，我需要保留viewstate，n jquery函数。任何人都可以指导如何我解决这个或任何替代解决方案也是有帮助的。



以下是代码..

I am trying to show some information to user, using a dynamically created Html "div" Element.

I am even adding jquery function to display that particular element with some cool effects like fadeIn or animate functions,(that too in c#.)

And there are 2 scenarios here,

1. If i add the dynamic div, at the start of the page.controls.Collection, Jquery
function will work,But ViewState of already existing static controls in my aspx page will be lost,(maybe the viewstate order of the controls gets modified when i add the div element at the very beginning of the collection)

2. So in order to retain viewstate of existing controls, i need to add the dynamic controls at the end of the collection, but here in this case, the jquery function will not work!

So, i need to retain both viewstate, n jquery function when i display that dynamic control.Can anyone guide how can i fix this or any alternate solutions also be helpful.

Below is the code..

 public static void create_a_floating_div_to_show_comp_details(Page page,Type type,Label totComponents_LBL,Label Components_No_Lbl)
    {
        //creating a new div element with custom style...
        HtmlGenericControl ht = new HtmlGenericControl("div");
        ht.ID = "genny";

//assigning all required style props for div element...
        ht.Style.Value ="position:fixed;top:230px;left:-150px;height:auto;width:150px;";

// jquery function to show some animation effects..
        string jqueryFunction_Show = "$('#genny').animate({left:'0px'},500);";

 //the below is calling the jquery function...
ScriptManager.RegisterStartupScript(page, type, "mykey", "<script type='text/javascript'>" + jqueryFunction_Show + "</script>", false);

//finally adding the controls to the page...
        page.Controls.AddAt(0, ht);//Scenario 1. here jquery function works but viewstate is //gone. 
//OR
        page.Controls.Add(ht);//Scenario 2. here, viewstate is retained but jquery function //doesn't works..
 }

推荐答案

（'＃genny'）。animate（{left：'0px'}，500）; ;

// 以下是调用jquery函数...
ScriptManager.RegisterStartupScript（页面，类型， mykey， < script type ='text / javascript'> + jqueryFunction_Show + < / script>， false ）;

// 最后将控件添加到th e page ...
page.Controls.AddAt（ 0 ，ht）; // 场景1.此处jquery函数有效，但viewstate已消失。
// 或
page.Controls.Add（ht ）; // 场景2.此处，保留viewstate但jquery函数//不起作用..
}

('#genny').animate({left:'0px'},500);"; //the below is calling the jquery function... ScriptManager.RegisterStartupScript(page, type, "mykey", "<script type='text/javascript'>" + jqueryFunction_Show + "</script>", false); //finally adding the controls to the page... page.Controls.AddAt(0, ht);//Scenario 1. here jquery function works but viewstate is //gone. //OR page.Controls.Add(ht);//Scenario 2. here, viewstate is retained but jquery function //doesn't works.. }

我认为你的问题是在DOM完全加载之前jQuery脚本正在运行。使用document.ready调用jQuery有一种非常方便的方法来避免这种情况：

I think your problem is that the jQuery script is running before the DOM has fully loaded. jQuery has a very convenient way to avoid this, with the document.ready call:

（document）.ready（function（ ）{

( document ).ready(function() {

这篇关于Jquery函数不适用于动态创建的div元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！