jQuery 自动完成项目点击和事件冒泡

发布于 2024-12-06 18:56:14 字数 1117 浏览 3 评论 0原文

如何让链接点击触发选择？

编辑：我指的是为什么行 $("a:contains('item2')").click();触发自动完成菜单选择？

<!doctype html>
<head>
    <title>Test</title>
    <script src="jquery-1.6.4.js"></script>
    <script src="jquery-ui-1.8.16.js"></script>
</head>

<script>

$(function() {

var menu = $('<div></div>')
    .attr('id', 'menu')
    .appendTo('body')
    .autocomplete({
        minLength: 0, 
        source: ['item1','item2'], 
        select: function(event, ui){
            alert('selected ' + ui.item.label);
        }
    })
    ;

$('<button></button>')
    .attr('id', 'open')
    .button({
        label: 'display menu'
        })
    .click(function() {
        menu.focus();
        menu.autocomplete("search", "");
    })
    .appendTo('body')
    .height(30)
    ;

$('<button></button>')
    .click(function() {
        $("#open").click();
        $("a:contains('item2')").click();
    })
    .appendTo('body')
    ;

});

</script>

<body>
</body>
</html>

原文

How can I get the link click to trigger a select?

EDIT: Im refering to why doesnt the line $("a:contains('item2')").click(); trigger a autocomplete menu select?

<!doctype html>
<head>
    <title>Test</title>
    <script src="jquery-1.6.4.js"></script>
    <script src="jquery-ui-1.8.16.js"></script>
</head>

<script>

$(function() {

var menu = $('<div></div>')
    .attr('id', 'menu')
    .appendTo('body')
    .autocomplete({
        minLength: 0, 
        source: ['item1','item2'], 
        select: function(event, ui){
            alert('selected ' + ui.item.label);
        }
    })
    ;

$('<button></button>')
    .attr('id', 'open')
    .button({
        label: 'display menu'
        })
    .click(function() {
        menu.focus();
        menu.autocomplete("search", "");
    })
    .appendTo('body')
    .height(30)
    ;

$('<button></button>')
    .click(function() {
        $("#open").click();
        $("a:contains('item2')").click();
    })
    .appendTo('body')
    ;

});

</script>

<body>
</body>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

疏忽 2024-12-13 18:56:14

这是由自动完成小部件中的“不幸”选择引起的 - 它不知道您正在选择哪个项目，除非您之前“悬停”它以使其成为活动菜单选项。

$('<button></button>')
  .click(function() {
    $("#open").click();
    $("a:contains('item2')").trigger('mouseover').trigger('click');
  })
  .appendTo('body');

This is caused by an "unfortunate" choice in the autocomplete widget -- it doesn't know what item you're selecting unless you've previously "hovered" it to make it the active menu choice.

$('<button></button>')
  .click(function() {
    $("#open").click();
    $("a:contains('item2')").trigger('mouseover').trigger('click');
  })
  .appendTo('body');

回复收藏 0 原文

~没有更多了~