在ClickClick上添加JavaScript到动态生成的asp按钮

背景我的页面基于SQL数据库的行创建对象列表。对于每个对象，动态生成一个DIV，其中包含一些项目，包括LinkButton和最初隐藏的另一个子DIV。我想要链接按钮来切换子DIV的隐藏属性。 JavaScript不是动态生成的，并且包含在ASPX页面中。在ClickClick上添加JavaScript到动态生成的asp按钮

问题我不知道如何使这个生成的LinkButton fire JavaScript包含在ASPX页面中并传入正确的DIV ID。

我猜我需要一个属性添加到该按钮，像这样：

myButton.Attributes.Add(reference to JS function + parameter of DIV's ID)

也许就像：

myButton.Attributes.Add("onclick", "Show_Hide_Display('"<%="' +idString+ '".ClientID%>"')");

当按钮被赋予了JS的onClick处理程序指向的属性到函数“Show_Hide_Display”和作为渲染ID计算的DIV's ID的参数。这个语法虽然不正确。

我该如何编写它，以便它调用“Show_Hide_Display”并传递当前子DIV的ID？所有的DIV具有相同的ID除了一些我想添加一个调用按钮引用它们的行号，例如“‘myDiv_’+ counter.ToString”

中的JavaScript：

function Show_Hide_Display(divID) { 

     var div = document.getElementById(divID); 
     var style = document.defaultView.getComputedStyle(div); 
     var display = style.getPropertyValue('display'); 

     if (display == '' || display == 'block') { 
      div.style.display = 'none'; 
     } else { 
      div.style.display = 'block'; 
     } 

    }

来源

2016-03-30 Ryan

使用以下格式...

myButton.Attributes.Add("onclick", "Show_Hide_Display(this.id);");

上述语法允许调用函数与ID作为其参数。

建议：尝试编写一个不依赖于控件的生成ID的通用函数。

如果这样对你的需求无用，那么请发布你的代码，这可能会给我一个更好的主意。

来源

2016-03-31 12:33:38

这实际上是我最终采用的路线。但是，将你的答案标记为未来有类似问题的人的答案。谢谢。 – Ryan

如果您使用的是jQuery，那么您可以使用jQuery委托方法。

$(document).on("click", "div.parent", function(){ 
    var subDivId = getSubDivByParent(this); 
    Show_Hide_Display(subDivId); 
};

您需要根据您的DOM结构实现getSubDivByParent。

如果你不使用jQuery，你需要自己附加事件。对于每个动态生成的元素。您需要在服务器代码中手动添加以下脚本来注册事件。

... your html code ... 
<script> 
var elem = document.getElementById('new-created-element'); 

elem.addEventListener("click", function(){ 
    var subDivId = getSubDivByParent(this); 
    Show_Hide_Display(subDivId); 
};) 
</script>

来源

2016-03-30 09:17:24

我没有使用JQuery，我有一个JavaScript函数接收DIV的ID，然后通过CSS显示/隐藏它。这个功能在其他地方使用并且工作正常。我需要能够在动态生成的按钮上调用它，但不知道语法。 – Ryan

所以你需要在服务器上添加脚本标签。该脚本用于注册您新创建的元素。如'

html code

' –

不，该脚本已经在页面上并且正常工作。我需要我的新按钮来调用该函数。 – Ryan

My suggestion is use jquery to achieve the functionality. 

My solution works if you want to toggle the immediate div for the link.just call onclientclick method to toggle the div. 

in linkbutton onclientclick="Show_Hide_Display(this)" 

function Show_Hide_Display(id) { 
    $(id).next('div').toggle(); 
} 

I hope this helps you .. Thanks

来源

2016-03-30 09:28:44

我可以使DIV隐藏/可见。我需要新创建的按钮来调用执行此操作的JavaScript函数。 – Ryan

在ClickClick上添加JavaScript到动态生成的asp按钮

回答

相关问题