带有 ascx 控件的 Javascript答案

【问题标题】：Javascript with an ascx control带有 ascx 控件的 Javascript
【发布时间】：2009-08-12 17:30:02
【问题描述】：

我设计了一个 ascx 控件（我在这个问题中将它称为 customControl）。该控件只是一系列下拉菜单，每个下拉菜单中都有文本值。下拉菜单位于面板内。

下面是：

然后我将其中一些放在一个也有文本框的页面上（我在这里将其称为文本框）

下面是：

所以我需要开发的是 Javascript，当任何 customControls 中的任何下拉列表具有选定的下拉索引更改事件时，在所有类型 customControl 上的控件的所有框中查找所有值页面，只需将该文本放入文本框中。

我是否需要定义我的控件以拥有一个类，以便 JS 可以轻松找到所有这些，然后让 JS 函数将文本框作为控件，以便它知道要输出什么以及在哪里输出？

【问题讨论】：

标签： javascript c# .net ascx

【解决方案1】：

使用“customControlDropDown”或其他任何 CSS 类设置所有下拉菜单，并使用“bigTextBox”或其他任何 CSS 类名称设置文本框，并使用一些 jQuery。

<script type='text/javascript'>
   $(document).ready(function(){
      $("select.customControlDropDown").change(function(){ //change event for all drop downs with customControlDropDown as its css class name
         var collectiveText = "";
         $("select.customControlDropDown option:selected").each(function(i){  //get all selected options in all the drop downs with customControlDropDown as its css class name
            collectiveText = collectiveText + $(this).text(); //append the item's text to a string variable
         });

         $(".bigTextBox").val(collectiveText); //set the textbox with css class name of bigTextBox with value of the string variable from above
      });
   });
</script>

我没有对此进行测试，但它应该可以工作。让我们知道。

【讨论】：

【解决方案2】：

在你的 ascx 控件中，必须有类“myClass”。

window.onload = function(){
    function getElementsByClass(containerId, class) 
    { 
      container = document.getElementById(containerId);
      var all = container.all¦¦container.getElementsByTagName('*') ;
      var arr = [] 
      for(var k=0;k<all.length;k++) 
        if(all[k].getAttribute("class").indexOf("class") != -1) 
          arr[arr.length] = all[k];
      return arr;
    }

    var arrEl = getElementsByClass("container", "myClass");
    var xOnChange = function()
    {
       //this
    }

    for (var ind = 0; ind < arEL.length; ind++)
    {
       arrEl[ind].onchange = xOnChange;
    }

}

在 html 或 aspx 中：

<div id="container>
   <!-- aspx controls -->
</div>

【讨论】：