Question

enter image description here 我正在使用jsp处理我的学校应用程序，而网络开发对我来说是新的。此刻我偶然发现了这个问题：

这个过程应该是这样的：

我有一个包含多个值的下拉框。例如：

房间：111 |建筑：ACC |容量：15

房间：111 |建筑：ACD |容量：25

房间：151 |建筑：ACC |容量：11

房间：113 |建筑：ACC |容量：15

当用户选择任何选项时，不会发生任何事情。

在下拉框旁边，我有一个<a href link..>，其中“看到图表”。

当用户按下“查看图表”时，应执行以下过程：

选中框中的字符串应分开，并且必须将Room＃和Bulding＃提取为单独的字符串
使用此链接打开新窗口： room_chart.jsp？room = 111＆amp; building = ACC（例如）

我知道如何分割字符串并一般地执行它，但我不知道如何在不重新加载页面的情况下动态地执行它...我想我需要实现JavaScript？

Answer 1

在锚点的href属性中调用Javascript函数。在该功能中，使用document.getElementById和选择框的id来获取selected string，将其拆分，然后发送ajax请求或使用window.open打开一个新窗口（但那不是动态的）。

<html>
    <script type="text/javascript">
        function view_chart() {
            var select = document.getElementById("room_select");
            var option = select.options.item(select.selectedIndex).value;
            var tokens = option.split(/[:|]/);
            var url = "room_chart.jsp?room="+trim(tokens[1])+"&building="+trim(tokens[3]);
            window.open(url);
        }

        function trim(value) {
            value = value.replace(/^\s+/,'');
            value = value.replace(/\s+$/,'');
            return value;
        }
    </script>
    <body>
        <select id="room_select">
          <option>Room: 014 | Building: ACT</option>
          <option>Room: 005 | Building: ACC</option>
        </select>
        <a href="javascript:view_chart()">Show Info</a>
    </body>
</html>

Answer 2

如果可能，您可以使用jquery，根据来自dorp的选择，将href元素替换为带有更新URL的全新元素。

动态更新<a href="" link..=""> when <selected> value is changed</selected></a>

2 个答案: