Question

我有以下代码：

 <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <style>
  .ui-autocomplete-category {
    font-weight: bold;
    padding: .2em .4em;
    margin: .8em 0 .2em;
    line-height: 1.5;
  }
  </style>  
   <script>
  $.widget( "custom.catcomplete", $.ui.autocomplete, {
    _create: function() {
      this._super();
      this.widget().menu( "option", "items", "> :not(.ui-autocomplete-category)" );
    },
    _renderMenu: function( ul, items ) {
      var that = this,
        currentCategory = "";
      $.each( items, function( index, item ) {
        var li;
        if ( item.category != currentCategory ) {
          ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
          currentCategory = item.category;
        }
        li = that._renderItemData( ul, item );
        if ( item.category ) {
          li.attr( "aria-label", item.category + " : " + item.label );
        }
      });
    }
  });
  </script>

  <script>
  $(function() {
    var data = [
    <?php do {  ?>

      { label: "<?php echo $row_Restaurants['RestaurantName']; ?>", category: "Restaurants" },
      <?php } while ($row_Restaurants = mysql_fetch_assoc($Restaurants)); ?>
    <?php do {  ?>


      { label: "<?php echo $row_Localities['LocalityName'];?>", category: "Locality" },
            <?php } while ($row_Localities = mysql_fetch_assoc($Localities)); ?>

    ];

    $( "#search" ).catcomplete({
      delay: 0,
      source: data
    });
  });
  </script>

然后在正文中我得到了一个简单的搜索按钮，其中来自db的所有数据都显示为上面带有自动完成的脚本。

因此，当点击输入或搜索按钮时，目前没有任何事情发生。那么我们可以拥有像“标签”之类的东西吗？ “category”作为链接/ href，以便点击搜索时的特定项目使用link / href＆amp;直接进入该页面。

Answer 1

您可以通过添加'select'事件来实现，例如：

thickness

Jquery自动完成，可点击href

1 个答案: