javascript - JavaScript 查找所选下拉项的索引，传递给超链接

Question

我遇到了一些麻烦，经过大量研究后无法找到解决方案。我在 SharePoint Designer 2010 中工作，并且有一个由列表填充的 ASP.net 下拉列表。我想从下拉列表中获取所选项目的索引值（例如 1）并将其传递给用于显示 EditForm.aspx 页面的 URL。见下文，感谢您提供的任何帮助！

<script type="text/javascript">
    function redirect(url) {
        var ddl = document.getElementById(&apos;DropDownList1&apos;);
        alert(&quot;HI!&quot;);

        var index = ddl.selectedIndex;
        var value = ddl.options[index].value;

        location.href = url + value;
        return false;
    }
</script>

<asp:LinkButton runat="server" id="LinkButton1"
                href="https://chartiscorp.sp.ex3.secureserver.net/Lists/System_Information/EditForm.aspx?id="
                onclientclick="javascript:redirect(this.href)">Edit System Info</asp:LinkButton>

<asp:DropDownList runat="server" id="DropDownList1" DataValueField="Title"
                  DataTextField="Title" DataSourceID="spdatasource1" />

Answer 1

您应该使用呈现的 ID：

var ddl = document.getElementById('<%=DropDownList1.ClientID%>');

和OnClientClick事件LinkButton：_

<asp:LinkButton onclientclick="...">

要获取索引，只需使用

var index = ddl.selectedIndex;

或者如果你想获得价值使用

var value = ddl.options[ddl.selectedIndex].value;

我建议在函数中进行重定向，而不是 HTML 属性。汇集所有：

<script type="text/javascript">
    function redirect(url) {
        var ddl = document.getElementById('<%=DropDownList1.ClientID%>'),
            index = ddl.selectedIndex,
            value = ddl.options[index].value;

        location.href = url + value;
        return false;
    }
</script>
<asp:LinkButton runat="server" id="LinkButton1"
                href="../Lists/System_Information/EditForm.aspx?id="
                onclientclick="redirect(this.href)">LinkText</asp:LinkButton>
<asp:DropDownList runat="server" id="DropDownList1" DataValueField="Title"
                  DataTextField="Title" DataSourceID="spdatasource1" />

这个 jsfiddle 展示了渲染输出的演示。