推特引导TypeAhead与PlusAsTab
Twitter Bootstrap TypeAhead with PlusAsTab
我有一个表单(HTML),我想在其中使用Enter键浏览元素(Enter键的作用应该类似于Tab)。为了实现这一功能,我使用了PlusAsTab库。另外,我需要一个文本框上的自动完成功能。对于自动完成功能,我使用的是来自Twitter引导程序的TypeAhead。
所以我使用PlusAsTab和Twitter Bootstrap Together。现在,使用Enter键的PlusAsTab导航可以很好地处理除与TypeAhead关联的元素之外的其他元素。对于与TypeAhead关联的元素,我需要按两次Enter键进行导航。我试着调试,但没有成功。我对Javascript还很陌生,因此无法正确调试它。
请在JSFiddle中找到代码
为了方便,我也在这里附上了代码
<!DOCTYPE html>
<html lang="en">
<head>
<title>Trial</title>
<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
</head>
<body>
<div class="plus-as-tab form-inline" id="transtable">
<select class="span1" autofocus="autofocus"><option>Dr</option><option>Cr</option></select>
<select class="span4">
<option>SelectAccount</option>
<option>GodAccount</option>
<option>SundryCreditors</option>
<option>SundryDebtors</option>
<option>Capital</option>
<option>Cash</option>
<option>Sales</option>
</select>
<input type="text" class="span4" placeholder="Narration" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["ChequeNo : ","Account No : ","No : ","On Canara Bank : " ]'>
<div class="input-prepend">
<span class="add-on">Rs</span><input class="span3" size="12" type="text" onchange="nextrow(this)" onkeypress="return allowonlynum(event)">
</div>
</div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://joelpurra.github.com/plusastab/lib/emulatetab/src/emulatetab.joelpurra.js"></script>
<script src="http://joelpurra.github.com/plusastab/src/plusastab.joelpurra.js"></script>
<script src="https://raw.github.com/twitter/bootstrap/master/js/bootstrap-typeahead.js"></script>
</body>
</html>
请帮我进一步调试这个问题。
在朋友的帮助下,我暂时解决了这个问题。在PlusAsTab库中,我又添加了一个调用来关注下一个元素,即,它将尝试两次关注下一元素。我知道这不是正确的解决方案,但它正在解决我的问题。
相关文章:
- Twitter Bootstrap typeahead:使用“this”获取上下文/调用元素
- Twitter引导程序Typeahead-Id&标签
- 对具有ui typeahead的对象中的值执行orderBy
- 当查询不在displayField中时,引导Ajax Typeahead不显示结果
- 如何让typeahead在我的搜索栏中填充自定义参数
- 一旦加载并渲染了角度引导typeahead,就使用回调
- 更改 Twitter Typeahead 返回的内容
- Model中的Typeahead返回空值以形成输入字段
- Typeahead.js未显示异步结果
- typeahead下拉结果向右对齐-向右拉
- Grunt browserfy在需要react bootstrap typeahead时失败
- 扩展引导程序的typeahead以便获取对象而不是字符串
- AngularJS Typeahead和$http请求限制
- Typeahead Bloodhoud没有't在TTL超时后清除缓存
- jquery.proxy in the bootstrap-typeahead.js context
- 为什么Bootstrap typeahead不适用于具有相同ID的输入元素
- Bootstrap Typeahead不适用于某些Div Id's
- 如何扩展bootstrap-typeahead.js这样的库
- 将TypeAhead与jQuery和Bootstrap 2.1结合使用
- 推特引导TypeAhead与PlusAsTab