在其他输入元素上出现jquery自动完成结果

在输入框中使用jquery自动完成。这是100％的工作，但认为造型需要一些工作。在其他输入元素上出现jquery自动完成结果

目前jQuery的建议显示在其他输入元素的文本后面。如果我点击低于我的选择框的jquery选项，则会触发选择框，而不是选择自动完成选项。

如何配置jquery自动完成功能？这是一个JS问题或CSS问题？

我试图禁用其他输入元素，命名周期与下面的代码，但它不工作：

<script type="text/javascript"> 
     $(function(){ 
     $("#customer").autocomplete({ 
      minlength: 5, 
      source: "get_customers", 
      open: function(event, ui) { // disable other inputs 
     $("input#period").attr("disabled", "disabled"); 
    }, 
     close: function(event, ui) { // re-enable other inputs 
     $("input#period").removeAttr("disabled"); 
    }, 
      messages: { 
      noResults: '', 
      results: function() {} 
     } 


     }); 
     }); 
</script>

任何建议，将无论是在获得了jQuery列表“ontop的”赞赏或禁用其他表单工作。

来源

2013-03-15 Smudger

我可以看到现场链接可能b的z-index问题...在你的css中使用z-index – 2013-03-15 07:58:19

尝试

.ui-autocomplete{ 
    z-index:50;  //Where 50 is just an arbitrary number superior to your form's z-indexes 
}

来源

2013-03-15 08:01:49 Bigood

我看不到您的html标记，因此无法提供示例，但您需要使用z-index css属性来解决此问题。

您需要在包含所有建议的容器上使用它。您甚至可能需要将其设置在某些背景元素上，但如果您尚未使用它，则不太可能。

我一般设置雷到了999，像这样：

z-index: 999;

只是为了确保它保持在上面。

来源

2013-03-15 07:58:44 webnoob

使用Z-index属性

.ui-autocomplete 
{ 
     z-index:50; 
}

来源

2013-03-15 08:39:00 Rahul

使用appendTo：YourContainerDiv

$("#TextBox").autocomplete({ 
       appendTo: '.ContainerDiv', 
       source: function (request, response) { 
        $.ajax({ 
         url: '@Url.Action("Action","Controller")', 
         type: "POST", 
         dataType: "json", 
         data: { Prefix: request.term }, 
         success: function (data) { 
          response($.map(data, function (item) { 
           return { label: item.Name, value: item.Name }; 
          })); 

         } 
        }) 
       } 

      });

来源

2017-05-10 06:37:16

在其他输入元素上出现jquery自动完成结果

回答

相关问题