asp with javascript

asp with javascript

本文关键字:javascript with asp      更新时间:2023-09-26

我有一个asp.net页面,当asp:DropDownList的索引为0时,我想使用javascript在页面上隐藏一个div。

我知道如何隐藏div,但我确实需要帮助如何使用javascript获取asp:DropDownLists的选定索引。

这就是我在javascript:中的内容

 function hideDiv() {
      var drpCampDock = document.getElementById('drpListCampaignDocketTemplate');
      var drpCampType = document.getElementById('drpCampaignType');

当它到达这个检查时,它会给出一个错误。

        if (drpCampDock.selectedIndex == 0) {
           document.getElementById('divBuilderMain').style.visibility = 'hidden';
        }
    }

我得到的错误是

Microsoft JScript runtime error: Object required

我想您的问题是呈现的select元素的(客户端)ID与asp:DropDownList的服务器端ID不同(请查看浏览器中呈现的HTML源代码以确认这一点)。

要获得正确的客户端元素,您必须使用以下代码:

var drpCampType = document.getElementById('<%= drpCampaignType.ClientID %>');

或者,您可以将ASP.NET标记更改为此,并将div的ID和dropdownlist的当前选择传递给javascript函数:

<asp:DropDownList ... onchange="hideDiv('divBuilderMain', this.value)" />
...
function hideDiv(divId, ddlIndex)
{
  if (ddlIndex == 0) document.getElementById(divId).style.visibility = 'hidden';
}

您正在使用.NET母版页吗?

然后你必须找出你的下线者的ID结果。在IE(F12)中调试页面并查看您获得的ID,它也将包含来自母版页的ID,因此您的函数没有获得正确的ID。

假设我有一个更新面板,在我的页面上有一个按钮(使用母版页)

--snip——

       <ContentTemplate>
            <asp:Button ID="Hiddenbutton" runat="server" Text="" />
        </ContentTemplate>

--snip——

使ID保持不变的一种方法是使用输入字段

 <input type="hidden" id="unchangedHidden" value="<%=Hiddenbutton.ClientID%>" />

如果我想从Java 中单击此按钮

function TestcodeBehind2()
{
 var o =document.getElementById('unchangedHidden').getAttribute('value');
 document.getElementById(o).click();
 }

通过读取隐藏输入字段的值,我相信我会得到正确的ID,无论我是否使用母版页。

我发现使用

 var o =document.getElementById('<%=Hiddenbutton%>');  

我的主页并不总是能成功检索到ID。

当我需要selectedIndex:时,我会这样做

var collx = document.getElementsByName("zmembertype");  
  for (ix = 0 ; ix < collx.length; ix++ ) {  
  if (collx[ix].checked)  
    temp = collx[ix].value;  
  }  

我想你需要一个环?

为了将来的参考,解决这些问题的一个好方法是查看脚本运行的页面的源代码。例如,asp:dropdownlist以html呈现,通常看起来像这样。

<select>
    <option value=""></option>
    <option value="FirstOption">First option</option>
    <option value="SecondOption">Second option</option>
</select>

因此,在此基础上,您可以在hideDiv 中的脚本中执行以下操作

function hideDiv() {
    var drpCampDock = document.getElementById('drpListCampaignDocketTemplate');
    var drpCampType = document.getElementById('drpCampaignType');
    var drpCampTypeValue = drpCampType.options[drpCampType.selectedIndex].value;

最后一行假设您的"drpCampaigType"实际上是"select"元素的名称。如果"drpCampaigType"是周围元素的名称,请尝试类似的方法

var drpCampType = document.getElementById('drpCampaignType').getElementsByTagName('select')[0];

继续执行与上面相同的代码行,因为它将把drpCampType分配给正确的选择元素。

正如我所说,看看来源总是很好的,可以帮助你。

HTH

在更改事件的下拉菜单上调用JS函数

例如

<asp:DropDownList ID="ddl" onchange="linkURL(this)" runat="server">
 </asp:DropDownList>

//JS函数

function linkURL(URL) 
    {
        alert (URL.options[URL.selectedIndex].value);
    }