Question

我希望能够根据下拉框中选择的内容更改图像...

我有这个JS代码来改变图像。当然是简化的。

<script type="text/javascript">
        function changeImage()
        {
            var oDDL = document.all("ddlNAME");
            var NAME= oDDL.options[oDDL.selectedIndex].text;

            switch(NAME)
            {
                case "Name":
                    document.getElementById("img").src="img1.png";
                    break;
                case "Name2":
                    document.getElementById("img").src="img2.png";
                    break;
                default:
                    document.getElementById("img").src="img3.png";
            }
        }
    </script>

当我调用此函数时，我在我的DDL实现中执行此操作。

<asp:DropDownList ID="ddlNAME" runat="server" OnTextChanged="changeImage()" >

但由于某种原因，changeImage()没有被解雇。它给我一个错误说

'changeImage' is not a member of 'ASP.default_aspx'

我知道这是一个菜鸟问题而且它很小......但这是我每天使用javascript的第一天所以请耐心等待。谢谢！

Answer 1

尝试：

<asp:DropDownList ID="ddlNAME" runat="server" onchange="changeImage()" >

我相信你使用它的方式是尝试调用类而不是javascript函数。

Answer 2

看起来你已经告诉它运行服务器端事件，所以它试图在你的ASPX脚本中找到一个名为changeImage（）的函数。

您需要它来运行Javascript事件客户端。请改用onChanged()事件。

<asp:DropDownList ID="ddlNAME" runat="server" onChanged="changeImage();" >

Answer 3

我认为你需要使用

<asp:DropDownList ID="ddlNAME" runat="server" onchange="changeImage();" >

而不是OnTextChanged

Answer 4

问题是下拉列表被视为服务器元素，而不是客户端控件。当它被更改时，您的整个页面都会回发到服务器，该服务器正在页面的类中查找名为changeImage的方法 - 当它找不到它时，它会抛出错误。

此外，您还要避免使用document.all之类的内容。请改用document.getElementById。除其他外，document.all是DOM级别0的扩展，并且比getElementById慢得多。

Answer 5

OnTextChanged是一个ASP.Net事件，它不适用于JavaScript。它在.vb文件中查找名为changeImage()的VB函数。

您可以尝试使用onChange="changeImage()"。

您还可以使用函数中的this关键字来引用运行函数的对象（在本例中为下拉框），而不是通过getElementById()或其他方式搜索它。 / p>

Answer 6

您需要将下拉代码更改为：

<asp:DropDownList ID="ddlNAME" runat="server" onchange="changeImage()" AutoPostBack="false" >

onchange是一个javascript事件处理程序，您使用的事件处理程序是一个ASP.NET控件事件处理程序。当您明确希望客户端代码运行时，AutoPostBack属性对于防止控件导致回发（执行服务器端代码）是必要的。

Answer 7

您必须将JavaScript代码注册到Page，然后将DropDownList的“OnChange”属性更改为JS函数。您可以在“RegisterStartupScript”和“RegisterClientScriptBlock”部分中read more here。

基于asp：DropDownList选择更改图像源

7 个答案: