javascript - 如何以 HTML 表单提交下拉选择?

标签 javascript html

我有这些条件下拉列表在屏幕上按预期运行,但我无法从下拉列表中获取选定的值以 HTML 表单输出(如果不包含 JavaScript,则可以)。仅文本输入按照下面的 xml 结果输出(Company & Add1)。我希望 xml 包含第一个下拉列表中的位置,以及条件第二个下拉列表中选定的城市。

<body>
<form action="http://TESTPLANETPRESS:8080/ObtainQuote" method="GET" >
    <fieldset>
       <legend>Location</legend>
       <select id="country" class="source" onchange="updateSelectTarget()">
          <option value="England">England</option>
          <option value="France">France</option>
          <option value="Germany">Germany</option>
       </select>   
       <select id="England">
          <option value="Birmingham">Birmingham</option>
          <option value="Liverpool">Liverpool</option>
          <option value="London">London</option>
       </select>
       <select id="France" class="hidden">
          <option value="Lyon">Lyon</option>
          <option value="Marseille">Marseille</option>
          <option value="Paris">Paris</option>
       </select>
       <select id="Germany" class="hidden">
          <option value="Berlin">Berlin</option>
          <option value="Hamburg">Hamburg</option>
          <option value="Munich">Munich</option>
       </select>
       <label for="Company">Company:</label><input type="text" name="Company" value="Google">
   <label for="Add1">Add1:</label><input type="text" name="Add1" value="1 Nowhere Street">
    </fieldset>
    <input type="submit" value="Submit">
</form>
<script>
	function updateSelectTarget () {
	   var id = this.options[this.selectedIndex].value;
	   var targets = this.parentNode.getElementsByTagName("select");
	   var len = targets.length;
	   for (var i = len - 1; i > 0; --i) {
		  if (targets[i].id == id) {
			 targets[i].style.display = "block";
		  }
		  else {
			 targets[i].style.display = "none";
		  }
	   }
	}
	
	function initChangeHandler () {
	   var el = document.getElementById("country");
	   el.onchange = updateSelectTarget;
	   el.onchange();
	}
	window.onload = initChangeHandler;
</script>
</body>

当前 XML 结果(不包括两个下拉列表的结果)。

<?xml version="1.0"?>

-<request type="GET">

<paths count="0"/>


-<values count="2">

<Company>Google</Company>

<Add1>1 Nowhere Street</Add1>

</values>

最佳答案

您想要值属性还是文本?基于Get selected value in dropdown list using JavaScript? (与第一部分类似),.value 应适用于 value 属性,.text 适用于所选文本。

此外,请提出两个不同的问题,而不是一个问题内嵌套 2 个问题。

关于javascript - 如何以 HTML 表单提交下拉选择?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29325487/

相关文章:

javascript - 围绕索引重新排序数组

javascript - 制作按钮。单击按钮。带表格的 DIV 转向并面向用户,但不起作用

javascript - 使用 fullpage.js 显示当前节号

javascript - 使用 JavaScript 进行 HTML 字段表单验证

javascript - 在 Safari 上使用 Jquery 获取被点击的元素

javascript - 在 TypeScript 中使用 core-js

javascript - jQuery toggleClass 不适用于标签

javascript - node.js 和 express 中的异常处理

javascript - 创建动态文本框,但代码不起作用

javascript - 如何使用 jQuery 系统地更改 Twitter.com 上所有头像图像的 src 属性?