天道酬勤,学无止境

带有ajax结果的多个输入字段上的Jquery ui自动完成(Jquery ui autocomplete on multiple input fields with ajax results)

问题

我正在尝试做其他几个人在堆栈上完成的工作。 我已经尝试了所有可用的示例,但似乎无法使其正常工作。 我已经复制了工作示例并反映了与我的情况相匹配的更改,但仍然没有。

我正在使用的 HTML 看起来像这样。

<tr>
            <td><a id="remRow"><span class="icon icon-squared-cross"></span></a></td>
            <td><input type="hidden" data-type="itemID" name="itemID[]" id="itemID" class="form-control autocomplete_txt" autocomplete="off">
            <input type="text" data-type="item_name" name="item_name[]" id="item_name" class="form-control autocomplete_txt" autocomplete="off" placeholder="Item Name"></td>
            <td><input type="text" name="item_sku[]" id="item_sku" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="SKU#"></td>
            <td><input type="text" name="item_qty[]" id="item_qty" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="Qty"></td>
            <td><input type="text" name="item_rate[]" id="item_rate" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="Cost"></td>
            <td><input type="text" name="balance[]" id="balance" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="Balance"></td>
            </tr>

Jquery 我从一个工作源得到了演示

//autocomplete script
$(".autocomplete_txt").keyup(function(){
    type = $(this).data('type');
    if(type =='itemID' )autoTypeNo=0;
    if(type =='item_name' )autoTypeNo=1;    
    $(this).autocomplete({
        source: function( request, response ) {
            $.ajax({
                url : 'ajax.php',
                dataType: "json",
                method: 'post',
                data: {
                   name_startsWith: request.term,
                   type: type
                },
                 success: function( data ) {
                     response( $.map( data, function( item ) {
                        var code = item.split("|");
                        return {
                            label: code[autoTypeNo],
                            value: code[autoTypeNo],
                            data : item
                        }
                    }));
                }
            });
        },
        autoFocus: true,            
        minLength: 0,
        select: function( event, ui ) {
            var names = ui.item.data.split("|");                        
            id_arr = $(this).attr('id');
            id = id_arr.split("_");
            element_id = id[id.length-1];
            $('#itemID_'+element_id).val(names[0]);
            $('#item_name_'+element_id).val(names[1]);
            /*$('#quantity_'+element_id).val(1);
            $('#price_'+element_id).val(names[2]);
            $('#total_'+element_id).val( 1*names[2] );*/
            calculateTotal();
        }               
    });
});

最后,PHP 来处理 json。

case "fetchAll": {

        $query = $db->rawQuery("SELECT itemID, item_name, item_sku FROM items ORDER BY item_name ASC");
        if($query) {
            $data = array();
            foreach($query as $key => $val) {
                //echo $val['itemID'];
                $name = $val['itemID'].'|'.$val['item_name'].'|'.$val['item_sku'];
                array_push($data, $name);
            }

            echo json_encode($out); 
        } else { echo "error"; }
    }
    break;

无论我使用什么示例,我都会不断收到未捕获的类型错误:无法读取未定义的属性“长度”。 我尝试使用 jquery 3.0,并下载了最新的 jquery.ui,认为这可能是问题所在。 我也试过恢复到旧版本来检查。

在这一点上,我确信我只是错过了一些东西。 3天有点荒谬所以我寻求帮助。 我知道堆栈上有类似的问题,是的,我都试过了。 如果你还没准备好猜我对jquery不太擅长。 我可以让其他一切工作,即使是 ajax 调用,但是,这...

问候。

回答1

CL哈德曼:

尝试在您的 head 部分使用以下脚本:

html文件:

<head>

<script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js'></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>


<script>

$( document ).ready(function() {

    //autocomplete script
    $(".autocomplete_txt").keyup(function(){
        type = $(this).data('type');
        if(type =='productCode' )autoTypeNo=0;
        if(type =='productName' )autoTypeNo=1;  
        $(this).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url : 'ajax.php',
                    dataType: "json",
                    method: 'post',
                    data: {
                       name_startsWith: request.term,
                       type: type
                    },
                     success: function( data ) {
                         response( $.map( data, function( item ) {
                            var code = item.split("|");
                            return {
                                label: code[autoTypeNo],
                                value: code[autoTypeNo],
                                data : item
                            }
                        }));
                    }
                });
            },
            autoFocus: true,            
            minLength: 0,
            select: function( event, ui ) {
                var names = ui.item.data.split("|");                        
                id_arr = $(this).attr('id');
                id = id_arr.split("_");
                element_id = id[id.length-1];
                $('#itemID_'+element_id).val(names[0]);
                $('#item_name_'+element_id).val(names[1]);
                /*$('#quantity_'+element_id).val(1);
                $('#price_'+element_id).val(names[2]);
                $('#total_'+element_id).val( 1*names[2] );*/
                calculateTotal();
            }               
        });
    });


  });




</script>
</head>

我无法复制您的场景,但您似乎与 jquery 脚本存在冲突。 希望这可以帮助...

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • 使用具有多个输入字段的jquery-ui自动完成(using jquery-ui autocomplete with multiple input fields)
    问题 大家下午好! 我花了很多时间,阅读了关于stackoverflow的所有文章...而且我无法使自动完成功能与multilpe输入字段一起使用。 我试图为每个输入分配一个'autoc'类,我为每个字段使用了不同的ID(实际上php循环生成字段的inedx)。 我不要求别人为我做这项工作。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。 提前致谢。 PS:我为我的英语不好而道歉... 现在跟随一段html: <input id="search_ctO" class="autoc" type="text" name="search_ct[]"> <input id="search_ct1" class="autoc" type="text" name="search_ct[]"> <input id="search_ct2" class="autoc" type="text" name="search_ct[]"> .... <input id="search_ctn" class="autoc" type="text" name="search_ct[]"> 和jquery: $('.autoc').on("focus", function() $(this).autocomplete({ minLength: 2, source: 'liste_contact
  • jQuery UI自动完成,带有项目和ID(jQuery UI autocomplete with item and id)
    问题 我有以下适用于一维数组的脚本。 是否可以使它与二维数组一起使用? 然后,通过单击页面上的第二个按钮来选择任何一个项目,都应显示选择的每个项目的ID。 这是带有一维数组的脚本: var $local_source = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"]; $("#txtAllowSearch").autocomplete({ source: $local_source }); 这是用于检查ID的按钮的脚本,该脚本不完整: $('#button').click(function() { // alert($("#txtAllowSearch").someone_get_id_of_selected_item); }); 回答1 您需要使用ui.item.label(文本)和ui.item.value(id)属性 $('#selector').autocomplete({ source: url, select: function (event, ui) { $("#txtAllowSearch").val(ui.item.label); // display the selected text $("#txtAllowSearchID").val(ui.item.value); //
  • 使用带有位置的 div 中的输入字段时,JqueryUi 自动完成显示在错误的位置:已修复(JqueryUi Autocomplete shown in wrong place when using input field in div with position:fixed)
    问题 我在通过向一个获得一个网页上的“模式窗口” div CSS属性position来fixed 。 div包含输入字段。 特别是,我正在使用jQueryUI的自动完成小部件。 有两个主要问题: 1)第一个是,由于div具有固定位置,当您向下滚动网页时,自动完成建议不会固定显示,而是随页面上下移动。 你可以在这个Codepen上看到这个问题,我正在使用来自 jQuery 网站的一个带有城市名称自动完成功能的例子。 2)第二个问题是自动完成的建议显示在页面的左上角,而不是仅在输入字段下方。 不幸的是,我试图在 Codepen 中重现这个问题,但我不能。 我很确定问题出在 CSS 上,尤其是 JQuery-UI 提供的此类样式属性。 也许问题可以通过使用自动完成小部件的位置选项来解决。 我应该定义什么 CSS 属性以及如何定义? PS:我使用http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css提供的主题。 回答1 查看 jQuery UI 库,我看到<ul>元素用于显示建议。 默认情况下,jQuery UI 将此元素附加到 HTML 文档,而不是附加到文本输入的<div> (用作“模式窗口”)。 但是,文档显示选项appendTo配置自动完成<ul>应该附加到哪个元素。 它使用
  • 带有混合文本/ id搜索的jQuery UI自动完成(jQuery UI Autocomplete with hybrid text/id search)
    问题 在使jQuery的自动完成小部件对我有用的过程中,我遇到了很多麻烦。 我正在使用来自服务器的键/值对列表。 我有以下要求: 如果用户从窗口小部件中选择一个值,我想将ID传递给服务器。 如果用户没有选择一个值并输入原始文本,或者修改了一个已选择的值,那么我希望清除ID字段,而只将原始文本发送到服务器。 假设someAjaxFunction返回自动完成窗口小部件期望的对象数组: {label:label, value:key} 。 最初,我将自动完成小部件设置如下: $(input).autocomplete({ source: sourceFunction, minLength: 1 }); 即使将鼠标悬停在项目之一上,也可以更改选择,从而将$(input)引用的文本框中的文本更改为基础键,而不是标签。 从用户交互的角度来看,这是非常不希望的-确实,我要进行调查的原因是因为我正在构建的网站的用户始终对输入的似乎变成随机数的文字感到困惑! 我在文本框下添加了一个隐藏字段,并实现了select()和focus()事件,以便像这样隐藏ID: $(input).autocomplete({ source: sourceFunction, minLength: 1 focus: function(event, ui) { $(idField).val(ui.item.value); $
  • 带有动态添加元素的jQuery中的自动完成(AutoComplete in jQuery with dynamically added elements)
    问题 我的要求是,当用户在可能也会动态添加的输入字段之一中输入一些字符(最少3个)时,显示几个选项。 由于数据量巨大,我一开始无法在页面加载时加载数据。 有一个ajax调用来获取经过过滤的数据。 我得到的问题是在第2行加载页面时出现Expected identifier错误。那么,请问以下代码有什么问题吗? $(document).on('keydown.autocomplete', 'input.searchInput', function() { source: function (request, response) { // Line # 2 var id = this.element[0].id; var val = $("#"+id).val(); $.ajax({ type : 'Get', url: 'getNames.html?name=' + val, success: function(data) { var id = $(this).attr('id'); $(this).removeClass('ui-autocomplete-loading'); response(data); },error: function(data) { $('#'+id).removeClass('ui-autocomplete-loading'); } }); }
  • 提升-通过Ajax提交自动完成(Lift - Autocomplete with Ajax Submission)
    问题 我想对ajax使用自动完成功能。 所以我的目标是: 当用户在文本字段中键入内容时,服务器将提供一些建议(我必须在数据库中找到建议) 当用户按下“输入”时,在“自动完成”框中单击其他位置,或者当他/她选择建议时,文本字段中的字符串将发送到服务器。 我首先尝试使用Lift提供的自动完成小部件,但遇到了三个问题: 这意味着要进行扩展选择,也就是说,您最初只能提交建议的值。 它不打算与ajax一起使用。 与WiringUI结合使用时,会出现越野车。 因此,我的问题是:如何结合使用jQuery自动完成功能并与lift中的服务器进行交互。 我想我应该使用一些回调,但是我不掌握它们。 提前致谢。 更新这是我尝试的第一个实现,但是回调不起作用: private def update_source(current: String, limit: Int) = { val results = if (current.length == 0) Nil else /* generate list of results */ new JsCmd{def toJsCmd = if(results.nonEmpty) results.mkString("[\"", "\", \"", "\"]") else "[]" } } def render = { val id = "my-autocomplete
  • Bootstrap 输入字段中的样式 jQuery 自动完成(Style jQuery autocomplete in a Bootstrap input field)
    问题 我已经为 Bootstrap 输入实现了一个 jQuery 自动完成功能。 jQuery 自动完成工作正常,但我想将结果视为组合,我想现在正在发生,因为我正在使用 BootStrap。 这是我分配自动完成的字段: <div class="form-group"> <label>Employee</label> <input class="form-control" name="txtEmployee" placeholder="Trabajador"> </div> $(this).autocomplete({ source: function(request, response) { $.ajax({ url: '@Url.Content("~/Employee/SearchEmployee")/', type: 'POST', contentType: 'application/json', dataType: "json", data: JSON.stringify({ employerId: 1, searchStr: me.val() }), success: function(data) { if (data.success) { response($.map(data.data, function(item) { return { label: "(" +
  • 使用JSON数据自动完成jQuery(AutoComplete jQuery Using JSON data)
    问题 想象一个具有以下数据的json文件: [ { color: "red", value: "#f00" }, { color: "green", value: "#0f0" }, { color: "blue", value: "#00f" }, { color: "cyan", value: "#0ff" } ] 我希望使用jQuery的自动完成方法,能够将颜色显示为选项,以选择并在输入上插入值。 <input type="text" name="selector" id="selector" /> <input type="text" name="color" id="color" /> <input type="text" name="value" id="value" /> 以上不需要介绍。 选择对的颜色搜索, input.color颜色值和input.value与价值的价值。 编辑:我有此JSON数据: [{ "label": "Sec\u00e7\u00e3o 1", "value": "1" }, { "label": "Sec\u00e7\u00e3o 2", "value": "2" }, { "label": "Sec\u00e7\u00e3o 3", "value": "3" }, { "label": "Sec\u00e7\u00e3o 4",
  • 如何使用带有 AJAX JSON 数据的 jQuery 自动完成组合框?(How to use a jQuery autocomplete combobox with AJAX JSON data?)
    问题 我需要使用组合框执行以下操作。 Select box有一个默认的城市列表,用户可以从中搜索。 如果用户在input框中input文本,我需要进行 ajax 调用以获取数据并向用户显示选项。 如果为用户请求获取数据,则应将这些城市附加到Select box的选项Select box 使用 jQuery 自动完成功能,我可以在用户输入字符串并显示结果时获取 json 数据。 但是,我对如何使用组合框集成它一无所知。 Combobox 使用静态数据数组进行搜索,如果我理解正确,则使用正则表达式来匹配值。 但是,如何中断它并使用 ajax 调用从服务器获取数据并更新结果? 输入文本框的自动完成: $( "#searchDestination" ).autocomplete({ delay: 500, source: function( request, response ) { $.ajax({ url: "/wah/destinationsJson.action", dataType: "json", data: { term: request.term }, type: "POST", success: function(data){ if(data.cities.length == 0) return response(["No matching cities found
  • jQueryUI 自动完成 - 当没有返回结果时(jQueryUI autocomplete - when no results are returned)
    问题 我想知道如何在使用 jQueryUI 自动完成时从服务器返回空结果时捕获并添加自定义处理程序。 关于这一点,似乎有一些与各种 jQuery 插件相关的问题(例如,当结果为空时,jQuery 自动完成显示“无数据”错误消息),但我想知道是否有更好/更简单的方法来实现相同的 jQueryUI自动完成。 在我看来,这是一个常见的用例,我认为 jQueryUI 可能通过添加干净处理这种情况的能力对 jQuery 自动完成进行了改进。 但是,我一直无法找到此类功能的文档,在我对其进行破解之前,我想抛出一些触角,以防其他人以前看到过。 虽然可能不是特别有影响力,但我可以让服务器返回任何内容 - 例如HTTP 204: No Content to a 200/JSON empty list - 任何最容易在 jQueryUI 的自动完成中捕获结果的东西。 根据文档,我的第一个想法是传递一个带有两个参数的回调,即一个请求对象和一个response callback来处理代码: 第三个变体回调提供了最大的灵活性,可用于将任何数据源连接到自动完成。 回调有两个参数: 一个请求对象,有一个名为“term”的属性,它指的是当前文本输入中的值。 例如,当用户在城市字段中输入“new yo”时,自动完成术语将等于“new yo”。 一个响应回调,它需要一个参数来包含向用户建议的数据。
  • 带有外部 JSON 文件的 jQuery UI 自动完成(jQuery UI autoComplete with external JSON file)
    问题 我正在尝试通过读取外部文件(即 data.json)来编写 jQuery UI 自动完成功能。 当我尝试从数组中读取代码时,代码工作正常,但是如果我尝试从外部文件中读取它,它就不再工作了!?! 不知道为什么!! 这是我的代码: http://plnkr.co/edit/LPqBGyocpswPrEzjb1Nq?p=preview 要么 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Autocomplete functionality</title> <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <script> $(function() { $( "#autocomplete1" ).autocomplete( { source:"data.json"
  • 如何在自动完成中建议相似的词(How to suggest similar words in autocomplete)
    问题 我有一个带有 jquery-ui-autocomplete 的位置输入字段。 <script type="text/javascript"> $(document).ready(function(){ var location_input=$('input[id="location-autocomplete"]'); var cityNames = [ { value: 'Mallorca' }, { value: 'Berlin' }, { value: 'London' }, // many other elements ]; location_input.autocomplete({ source: cityNames, minLength: 2 }); } ); // keeps same width as box jQuery.ui.autocomplete.prototype._resizeMenu = function () { var ul = this.menu.element; ul.outerWidth(this.element.outerWidth()); } </script> 但是,我对同一位置可以有不同名称的情况不满意。 例如,假设用户想要查找 Mallorca。 他可以写: Mallorca 、 Majorca 、 Palma de
  • Jquery ui 自动完成 - 多个来源(Jquery ui autocomplete - multiple sources)
    问题 对于 1 个源,这是 ajax 调用后的正确代码: url: "links2.xml", 我希望源是多个 xml 文件。 我如何包含额外的路径? 谢谢。 回答1 首先,文档说“自动完成插件期望该字符串指向将返回 JSON 数据的 URL 资源。” 注意:JSON,而不是 XML,因此您需要在下面将您的 xml 转换为 json。 xml 到 json 可以在您的服务器或客户端浏览器上完成。 如果可能,在您的服务器上执行一次会更快。 要使用多个源文件,您需要首先在 HTML/JS 页面中加载多个文件。 然后将它们连接到一个 Javascript 数组中,然后将该数组提供给自动完成调用。 就像是: <script> myproject_choices = []; // global var. Hence prefix with project name. var cb = function(data){jQuery.merge(myproject_choices, data);}; // callback for ajax $.getJSON('ajax/choices1.json', cb); // fetch and concatenate the choices $.getJSON('ajax/choices2.json', cb); $.getJSON('ajax
  • jQuery 自动完成多个输出(jQuery AutoComplete multiple Output)
    问题 我正在使用 jQuery AutoComplete 根据输入的值从数据库中获取结果。 然后,用户将单击搜索按钮以告诉页面搜索该特定条目的详细信息。 我想获得 2 个值, Name和Title 。 我只想向用户显示名称,而页面使用标题作为搜索条件。 例如:当一个人输入Vehicle 时,结果将在列表中显示Vehicle1, Vehicle2 。 当用户单击Vehicle1 ,隐藏框将与Title 一起发布,即Bike ,例如Vehicle2将发布带有Car的隐藏框。 我可以让名称正确显示在文本框中,但我一生都无法(并且经过 2 天的搜索)将标题绑定到隐藏框。 JavaScript: <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { $(".tb").autocomplete({ source: function (request, response)
  • 如何自定义格式的“自动完成”插件结果?(How can I custom-format the Autocomplete plug-in results?)
    问题 我正在使用jQuery UI Autocomplete插件。 有没有办法在下拉结果中突出显示搜索字符序列? 例如,如果我将“ foo bar”作为数据并键入“ foo”,则在下拉菜单中将获得“ foo bar”,如下所示: 回答1 是的,如果您对自动完成功能进行了猴子补丁,则可以。 在jQuery UI v1.8rc3中包含的自动完成小部件中,在自动完成小部件的_renderMenu函数中创建建议弹出窗口。 该函数的定义如下: _renderMenu: function( ul, items ) { var self = this; $.each( items, function( index, item ) { self._renderItem( ul, item ); }); }, _renderItem函数的定义如下: _renderItem: function( ul, item) { return $( "<li></li>" ) .data( "item.autocomplete", item ) .append( "<a>" + item.label + "</a>" ) .appendTo( ul ); }, 因此,您需要做的是将_renderItem fn替换为您自己的产生所需效果的创作。 重新定义库中的内部函数的这项技术,我已经学习到了,称为“猴子修补”。
  • 如何通过 ajax 使用 onfocus() 函数将值保存到 sql 数据库(How to save a value to an sql databse using an onfocus() function via ajax)
    问题 基本上我想要做的是当用户关注另一个输入时将一个值从表单保存到 sql 数据库中。 我想最好的方法是使用ajax。 (希望这是有道理的!)这是我的代码: 剧本: function storeLocation() { location = $("#location").val(); $.ajax({ url: 'storeLocation.php', type: 'post', data: 'feed_id=' + location, success: function (result) {} }); } html: <form id="profile" action = "index.php" method="post" name="profile"> <input type="text" name="location" id="location" autocomplete="off"> <input type="submit" value="submit"> </form> 和 StoreLocation.php 代码: <?php require 'core.php'; require 'connect.php'; $city = $_POST['feed_id']; $idPerson = getfield('idPerson','person'); $query =
  • 带有servlet的jQuery自动完成UI不返回任何数据(jQuery autocomplete UI with servlet is not returning any data)
    问题 过去几个小时来,我一直在摆弄这个代码片段,但是我无法理解jQuery的自动完成UI的工作方式。 我遵循了本教程http://viralpatel.net/blogs/tutorial-create-autocomplete-feature-with-java-jsp-jquery/,我使用了相同的示例,但是我使用了一个servlet来代替向JSP发送请求。 该请求到达servlet“ Fetcher”,它也执行,但是什么都没有返回到页面。 这是代码。 public class Fetcher extends HttpServlet { [...] List<String> countryList = new ArrayList<String>(); String param = request.getParameter("term"); countryList.add("USA"); countryList.add("Pakistan"); countryList.add("Britain"); countryList.add("India"); countryList.add("Italy"); countryList.add("Ireland"); countryList.add("Bangladesh"); countryList.add("Brazil")
  • 我在同一个表单 (z-index) 上遇到了 jquery-ui 自动完成和滑块相关的问题(I'm having trouble with jquery-ui autocomplete and slider on the same form (z-index) related)
    问题 我正在尝试使用 jQuery ui lib 创建一个网页。 我的设计在表单顶部的输入字段上使用了 jQuery ui 自动完成功能。 在这个自动完成输入表单的正下方是一些 jQuery 滑块。 问题是当自动完成框填充时,结果显示在滑块控件的句柄后面。 这来自 jQuery 构建滑块的方式,这使得滑块的 z-index 为 3。jquery 自动完成控件下拉部分的 z-index 似乎始终设置为 1。我尝试增加 z - 正在自动完成的输入元素的索引,但这似乎不会影响 jquery 为自动完成下拉列表创建的元素的 z-index。 我还尝试编写自己的javascript来按类(它是一个ul)获取下拉菜单元素并手动设置它的z-index。 这似乎也不起作用。 我假设这意味着 jQuery 代码以某种方式覆盖了我正在进行的 z-index 更改。 这不是浏览器错误,因为它是 Firefox、Chrome、Safari 和 IE 上的问题。 这是jQuery给出的下拉框(UL元素)的实际z-index问题。 有没有人有解决这个问题的方法? 人们通常如何摆弄 jQuery 自动生成的元素来构建它的控件。 回答1 使用 open 和 close 事件修改 z-index 对我有用: $( "#tags" ).autocomplete({ source: availableTags
  • jQuery UI DatePicker上的日期范围选择器(Date range picker on jquery ui datepicker)
    问题 我使用jquery ui创建了一个日期范围选择器,您可以在其中使用相同的内联日历来选择两个日期。 在这里查看我的小提琴:http://jsfiddle.net/kVsbq/4/ JS $(".datepicker").datepicker({ minDate: 0, numberOfMonths: [12, 1], beforeShowDay: function (date) { var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val()); var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val()); return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""]; }, onSelect: function (dateText, inst) { var date1 = $.datepicker.parseDate($.datepicker
  • 自动完成请求/服务器响应是什么样的?(What does autocomplete request/server response look like?)
    问题 这似乎是一个黑洞:经过一个小时的搜索jQuery UI网站,Stack Overflow和谷歌搜索,我还没有找到有关如何编写AutoComplete服务器端的最基本信息。 什么参数传递给服务器,JSON响应应该是什么样? 我一定想念一些东西,因为其他人怎么学到的呢? 网站似乎只讨论客户端JavaScript代码,而没有讨论协议或服务器端示例。 我需要足够的资源来使最简单的远程示例正常工作。 回答1 什么参数传递给服务器 您需要将request.term传递到服务器端代码(来自文档): 一个请求对象,具有一个称为“ term”的单个属性,它引用文本输入中当前的值。 基本上,在您的autocomplete代码中,您将获得以下内容: $("#autocomplete").autocomplete({ // request.term needs to be passed up to the server. source: function(request, response) { ... } }); JSON响应应该是什么样的? autocomplete窗口小部件需要具有label和value属性的JSON对象数组(尽管如果仅指定value ,它将用作标签)。 因此,在最简单的情况下,您可以仅返回如下所示的数据: [ { label: 'C++', value: 'C++' }, {