Question

我在JSP中运行以下代码。我在检索值时面临问题..比如从下拉列表中说出然后在下拉列表所在的同一页面中使用/显示该值，但 WITHOUT 重定向到下一页。

<div class="form-row"> 
    <label>
        <span>Department Name</span> 
        <select name="s1">
            <option>A</option>
            <option>B</option>
            <option>C</option>
        </select>
    </label>
</div>
<input type=text value="">

当我从列表中选择任何内容时，应该检索该值而不转到下一页。它应该在同一页面中检索并显示在文本框中。

没有Ajax，怎么办？有人可以帮我吗？？

非常感谢。

Answer 1

好的，我们将不得不使用JavaScript。正如ShamSUP所说，JSP是一种服务器端语言，而JavaScript是用户端语言。谷歌对此有了更多的了解。

代码就是这样。

<div class="form-row"> 
            <label>
                <span>Department Name</span> 
                <select name="s1" onChange="displayDropValue()">
            <option>A</option>
             <option>B</option>
             <option>C</option>
          </select>
           </label>
        </div>

<input name="o1" type=text value="">

<script>
function displayDropValue() {
  dropdownValue = document.getElementsByName("s1")[0].value; //Get dropdown value by looking for the name attribute. Since this function returns as array we have to use [] to say first array element
  document.getElementsByName("o1")[0].value = dropdownValue;
}
</script>

我没有测试代码，但它应该有效。

Answer 2

您需要使用javascript才能获得所需的效果。因为JSP是服务器端脚本语言，所以它无法“看到”用户从字段中选择的内容，除非以某种方式将值提交给服务器进行处理，例如表单提交。

Javascript是一种客户端脚本语言，这意味着它可以在用户的Web浏览器中处理，因此可以“看到”用户对页面上的任何内容所做的操作。为了达到你想要的效果，所需的javascript量是最小的。

首先，您必须找到一种方法来指定要填充的文本输入。最简单的方法是向其添加id。

<input type="text" id="textfield" value="">

执行此操作后，我们需要绑定一个事件处理程序来监听select框的值何时更改，并获取该值并将其放入文本字段中。

<script type="text/javascript">
// get the select element, then bind a function to the change event
document.querySelector('select[name=s1]').onchange = function(){
    // get the text field, and set it's value to the value of the select box
    document.getElementById('textfield').value = document.querySelector('select[name=s1]').value;
}
</script>

现在您只需将该代码放入html中head或body的末尾。

如何检索文本框的值并在同一页面中使用它而不重定向到JSP中的下一页？

2 个答案: