1

我有一个

function calcRoute() {
  var start = document.getElementById('start').value;
}

然后一个

<select id="start" onchange="calcRoute();">
  <option value="somevalue">Dropdown 1</option>
  <option value="somevalue">Dropdown 2</option>
  <option value="somevalue">Dropdown 3</option>
</select>

一切正常。现在，我需要一个输入框，而不是下拉列表。问题是我尝试过

<form onsubmit="calcRoute();" method="get" id="start" action="#">
<input type="text" id="start" name="start">
<input type="submit" value="Go">
</form>

但它不起作用（它正在将表单提交到服务器）..你可以在这里看到一个演示。请记住，我不需要下拉列表（它在那里只是为了证明一切正常），所以它可以去（没有双重调用函数的问题）。提前致谢 ：-）

4

1 回答 1

1

你应该改变：

<input type="text" id="startText" name="start">

至：

<input type="text" id="start" name="start">

由于 Javascript 正在搜索 ID，而不是名称。（并且在您的代码中，ID 与 Javascript 搜索的不同）

如果要在同一页面中使用输入和下拉列表，只需将变量定义更改为：

var start = document.getElementById('startText').value || document.getElementById('start').value;

就好像输入为空一样，Javascript 使用下拉列表中的值。

更新

除了更改 ID 之外，请将您的表单更改为：

<form>
    <input type="text" id="start" name="start">
    <input type="button" onclick="calcRoute();" value="Go">
</form>

不允许表单提交。

于 2013-04-28T00:47:22.733 回答