的getElementById（）和输入表格

我有一个的getElementById（）和输入表格

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>

但它不工作（它提交表单到服务器）..你可以看到一个演示here。请记住，我不需要下拉列表（它只是为了证明一切正常），所以它可以走（没有双重称为函数的问题）。如JavaScript正在搜索ID，而不是名称

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

：在此先感谢:-)

来源

2013-04-28 MultiformeIngegno

你有多个元素具有相同的ID，输入没有onsubmit属性等 – Musa 2013-04-28 00:49:07

我设置了2个元素（下拉框和输入框），让你看到下拉工程（而输入框不）。看看这里（没有下拉）：http://ffio.it/test4.html – MultiformeIngegno 2013-04-28 00:51:20

输入元素的ID是（startText而不是开始）错误。请看下面的答案。 – 2013-04-28 00:53:45

您应该更改从：

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

要。（在你的代码中的ID是什么JavaScript是搜索不同）

如果你想使用的输入，并在同一个页面的下拉列表中，你只需要改变你的变量定义的东西如：

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

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

更新

在ADITION的ID的变化，你的形式改变的东西如：

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

如果您不想让表单提交。

来源

2013-04-28 00:47:22

如果您在同一页面中使用下拉列表，只需更改输入中的ID和JavaScript搜索的内容即可。（对于名称没有冲突） – 2013-04-28 00:48:21

我不需要同一页面中的下拉列表。我只是把它们放在演示中让你看到它的作品（而输入框不）。无论如何，我做了你的变化，但似乎并没有工作:( - > http://ffio.it/test4.html – MultiformeIngegno 2013-04-28 00:50:41

@MultiformeIngegno在答案中看到更新 – 2013-04-28 00:53:12

的getElementById（）和输入表格

回答

相关问题