【问题标题】:jQuery UI Autocomplete - how do I get the user entered valuejQuery UI Autocomplete - 我如何获取用户输入的值
【发布时间】:2011-03-23 00:20:06
【问题描述】:

免责声明:我已经查看了相关问题,但找不到此特定问题的解决方案。

场景是这样的:

根据用户是从下拉列表中选择了建议还是没有匹配项,我想执行不同的 jQuery ajax 操作。我该怎么做呢?我卡住的地方是如何捕获当前在自动完成输入文本框中的输入?

谢谢

【问题讨论】:

    标签: jquery user-interface autocomplete


    【解决方案1】:

    说实话,我不确定。查看文档 search 事件应该可以工作。

    编辑 阅读文档真的很有帮助。 :D

    搜索方法。

    触发搜索事件,当 数据可用,然后将显示 建议;可以由一个 类似选择框的按钮来打开 点击时的建议。如果没有价值 参数被指定,当前 使用输入的值。可以叫 使用空字符串和 minLength: 0 显示所有项目。

    $( ".selector" ).autocomplete({
       search: function(event, ui) {
         $.ajax{
           //Your ajax parameters...
    
           success: function(data) { //No idea what format your data is in...
             if(data['status'] == false) { //there is no result
               //return your data.
               //Trigger the events you want if the item does no exist.
             }
             else if(data['status'] == true){
                //return data normally.
             }
           }
    
         }
       }
    });
    

    【讨论】:

    • 我已经连接了更改事件,为了进行测试,我在其中放置了一个警告框。似乎没有任何效果:(
    • 希望搜索对您有用。基本上我只是在 ajax 对象中放了一个 if 语句。如果您在搜索选项中使用 $.ajax,您可能也可以这样做。
    【解决方案2】:

    要捕获当前在自动完成输入文本框中的输入,您可以使用select 方法,如autocomplete remote example

        $("#birds").autocomplete({
            source: "search.php",
            minLength: 2,
            select: function(event, ui) {
                log(ui.item ? ("Selected: " + ui.item.value + " aka " + ui.item.id) : "Nothing selected, input was " + this.value);
            }
        });
    

    如果ui.item 有值,则表示有匹配的内容(并且匹配的值在其中)。

    如果您想要用户输入的内容,请使用this.value

    【讨论】:

    • 我的选择如下所示: select: function (event, ui) { var normalText = ui.item ? ui.item.label.replace(/(<.>)/gi, '') : $(this).value; var myTargetUrl = "CreateNew/CreateNew?newTitle=" + normalText; $('#').val(normalText); $.ajax({ type: 'POST', url: myTargetUrl });警报(我的目标网址);返回假;但是警报对话框永远不会出现,当我输入一个不存在的值并按 在什么时候我可以访问输入的值时,我尝试了搜索事件、更改事件等无济于事
    • 我不知道为什么没有出现警报。也许ajax调用抛出异常。但是我在这里做了一个示例,它确实出现了jsbin.com/aqewu4/edit(即使 ajax 调用没有指向任何内容)。也许该示例页面可以帮助您解决问题。如果没有,请使用更多详细信息编辑您的问题或创建一个新问题。
    猜你喜欢
    • 2022-01-21
    • 2023-03-10
    • 2020-06-23
    • 2017-07-06
    • 2012-04-14
    • 2020-02-28
    • 1970-01-01
    • 2011-12-29
    • 1970-01-01
    相关资源
    最近更新 更多