Javascript 在表中添加多个用户控件

我试图在仪表板上放置多个用户控件。但只有一个用户控件可见

Dashboard.aspx:

<table cellpadding="0" cellspacing="0" border="0" width="220px">
<tr>
<td>
<dc:MyControl ID="c1" runat="server"/>
</td>
<td>
<dc:MyControl ID="c2" runat="server"/>
</td>
</tr>
</table>

//Display gauge on the page (has some html5 elements like canvas)
<div id="gauge1" class="gauge"></div>

<script type="text/javascript">
var <%=this.ClientID%>global = new jGauge(); // Create a new gauge.
<%=this.ClientID%>global.id = 'gauge1'; // Link the new gauge to the placeholder DIV.


// This function is called by jQuery once the page has finished loading.
$(document).ready(function () {
<%=this.ClientID%>global.init(); // Put the gauge on the page by initializing it.
});
</script>

看起来用户控件中创建的全局对象覆盖了另一个对象

然后，我将javascript代码更改为：

MyControl.ascx:

<table cellpadding="0" cellspacing="0" border="0" width="220px">
<tr>
<td>
<dc:MyControl ID="c1" runat="server"/>
</td>
<td>
<dc:MyControl ID="c2" runat="server"/>
</td>
</tr>
</table>

//Display gauge on the page (has some html5 elements like canvas)
<div id="gauge1" class="gauge"></div>

<script type="text/javascript">
var <%=this.ClientID%>global = new jGauge(); // Create a new gauge.
<%=this.ClientID%>global.id = 'gauge1'; // Link the new gauge to the placeholder DIV.


// This function is called by jQuery once the page has finished loading.
$(document).ready(function () {
<%=this.ClientID%>global.init(); // Put the gauge on the page by initializing it.
});
</script>

//在页面上显示仪表（有一些html5元素，如画布）
var global=new jGauge（）；//创建一个新仪表。
global.id='gauge1'；//将新仪表链接到占位符DIV。
//一旦页面完成加载，jQuery就会调用此函数。
$（文档）.ready（函数（）{
global.init（）；//通过初始化将仪表放置在页面上。
});

但仍然只有一个用户控件可见。有什么建议吗？

试试这个

<table cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr>
        <td style="width:50%;">
            <dc:MyControl ID="c1" runat="server"/>
        </td>
        <td style="width:50%;">
            <dc:MyControl ID="c2" runat="server"/>
        </td>
    </tr>

---

您仍然需要更改容器ID（

gauge1

），使其对于每个控件都是唯一的，否则它将被覆盖。大概是这样的：

<div id="<%=this.ClientID%>gaugecontainer" class="gauge"></div>

并修改Javascript以使用动态ID：

<%=this.ClientID%>global.id = '<%=this.ClientID%>gaugecontainer'; 
// Link the new gauge to the placeholder DIV.

global.id='gaugecontainer'；
//将新仪表链接到占位符DIV。

谢谢您抽出时间。我试过了，但还是没有成功。我就是不知道少了什么…@benjamin54我不确定；在这一点上，我将通过代码检查Firebug是否存在任何Javascript错误/跟踪。