javascript - 我想将单击事件绑定(bind)到 xpages type-ahead 中的 li 元素

Question

我正在使用 Tim Tripcony 的奇特的提前输入解决方案，它工作正常。 http://www.timtripcony.com/blog.nsf/d6plinks/TTRY-7XD5P9

但我希望它的行为有点不同，我不想用所选下拉条目中的值填充编辑框，而是想将点击事件附加到所选条目并将用户重定向到所选文档。

这意味着我需要覆盖当前的点击事件并将隐藏的“unid”发送到我的点击事件并在 JavaScript 中进行重定向。

我尝试向 SSJS 函数中的 ul 和 li 元素添加一个类，以便可以将它们绑定(bind)到单击事件。但这似乎并不适用。我不确定应该如何附加单击事件，因为预输入“ajax”控件上没有事件处理程序。

这就是我想做的

1. 用户在编辑框中输入字符
2. xpages Typeahead 将结果作为下拉列表返回
3. 返回的每个文档的unid需要隐藏在下拉列表中
4. 点击其中一个下拉条目将重定向到另一个页面，显示用户根据隐藏的 unid 单击的文档。

顺便说一句。我知道如何绑定(bind)事件，因此不需要对此进行进一步解释，但我需要知道如何与 xpages 中的预先输入功能相关联。

下面是从下拉列表生成的 html 元素的示例

<ul class="dijitReset dijitMenu dijitComboBoxMenu" dojoattachevent="onmousedown:_onMouseDown,onmouseup:_onMouseUp,onmouseover:_onMouseOver,onm>ouseout:_onMouseOut" style="top: 0px; overflow-x: hidden; overflow-y: hidden; width: 310px; visibility: visible; " id="home:_id1:_id19:_id29:search_popup" dir="" widgetid="home:_id1:_id19:_id29:search_popup">

<li class="dijitReset dijitMenuItem" role="option" id="home:_id1:_id19:_id29:search_popup1">
<table>
<tbody>
<tr>
<td><img src=""></td><td valign="top"><p><strong>Entry1</strong></p>
<p>
<span class="informal">TADN-8CWLTP<br>2012-03-01 09:29:07 CET<br>Test</span>
</p>
</td>
</tr>
</tbody>
</table>
</li>


<li class="dijitMenuItem dijitMenuNextButton" dojoattachpoint="nextButton" role="option" style="display: none; " id="home:_id1:_id19:_id29:search_popup_next">More choices</li>

</ul>

谢谢 托马斯

Answer 1

看起来是我自己解决的，见下文

首先，我在下拉列表中添加了一个类和 unid

<li><table id=\"" + unid + "\" class=\"clicktable\">....</li></code>

其次，在 onclick 事件中，我使用 jquery live() 将表绑定(bind)到 click 函数

$(".clicktable").live("click", function(){
  alert($(this).attr("id"))
});

因此，当用户单击下拉条目时，将单击表格而不是 li，然后我可以轻松编写代码来重定向用户，因为我知道单击了哪个 unid。