使文本框像下拉框一样工作

我想复制我有一个下拉框允许用户选择标签，然后返回与此术语相关的文章的功能。使文本框像下拉框一样工作

该文本框需要接受搜索词并以相同的方式工作。我尝试了所有我能想到的，但我得到零结果。

要复制该行为，请从下拉框中选择一项并返回文章。然后尝试在搜索框中输入相同的字词，并且不返回任何文章。

任何想法，为什么？下面是该网站：

http://www.api.jonathanlyon.com/getpocket/view.html

来源

2013-01-21 Jonathan Lyon

添加'返回false;'的'validateForm'功能 – PitaJ

我们需要看到的结束一些代码。你可以发布一些吗？看起来文本框正确地传递了变量，但是从那里会发生什么？ – Charles

@PitaJ是对的。您的代码无法停止提交操作，因此网页将被刷新，这就是为什么没有搜索结果。 – hit1205

一个解决办法是改变你的搜索框代码是这样的：

<form name="searchform" > 
    <input type="text" name="searchterm"> 
    <input type="button" value="search" onclick="validateForm()"> 
</form>

既然你是不是真的提交表单，不想重装一个页面，您可以只使用button的click事件，而不是form的submit事件。

如果您希望在按下Enter按钮时获得文章，可以采用以下方法之一（可能有更好的方法，我现在没有想到......）。您可以使用事件来运行将测试Enter按钮的功能。当它找到它时，它会调用validateForm。此功能添加到您的脚本：

function init(){ 
    document.getElementById("searchterm").addEventListener(
     "keydown", keydown 
    ); 
    function keydown(e){ 

     if(e.keyIdentifier == "Enter"){ 
      validateForm(); 
     } 
    } 
}

，你的身体标记改成这样：

<body onload="init();">

下将事件侦听器textbox一旦页面加载。

警告之一：我正在运行Chrome的Linux笔记本电脑上测试此操作。我不知道Mac是否拨打Enter密钥Return，我不知道.keyIdentifier是否是跨浏览器兼容的。这是你需要考虑的事情，但这应该让你开始。

来源

2013-01-21 18:05:01

完美谢谢！ –

是否可以通过在输入值后按回车来使文本框工作以及按下搜索按钮？ –

我推荐使用jQuery UI组合框。它允许你输入值，自动完成和下拉功能。这需要一些时间来熟悉jQuery用户界面，但它的强大，适合几乎所有的解决方案有关的用户交互：

jQuery UI Combobox demo

来源

2013-01-21 18:09:22

使文本框像下拉框一样工作

回答

相关问题